* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

    font-family: "Courier New", Courier, monospace;
    
    /* 2. Harf Arası Boşluğu Daraltma (Negatif değer boşluğu kapatır) */
    letter-spacing: -1px; 
    
    /* 3. Satır Arası Boşluğu Düzenleme (Metnin yayılmasını engeller) */
    line-height: 1.2;


    /* Okunabilirliği artırmak için hafif kalınlık */
    font-weight: 600;
}

:root {
    --dark-pastel-red: #d43c60;
    --accent-red: #a6445a;
    --soft-white: #ffffff;
    --light-gray: #f8f9fa;
    --text-dark: #2d3436;
    --transition: all 0.3s ease-in-out;
}

body {
    background-color: var(--light-gray);
    color: var(--text-dark);
    line-height: 1.6;
}

/* --- HEADER / NAVBAR --- */
.navbar {
    background-color: var(--dark-pastel-red);
    height: 40px;
    display: flex;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 2000;
}

.container {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}
.container-kategori {
    max-width: 1200px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 20px;
}/* Toast Bildirim Kutusu */
#toast-notify {
    position: fixed;
    top: 20px;
    right: 20px;
    background: #6366f1; /* Sizin Indigo renginiz */
    color: white;
    padding: 12px 24px;
    border-radius: 12px;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.2);
    font-family: 'Inter', sans-serif;
    font-size: 14px;
    font-weight: 600;
    z-index: 9999;
    display: flex;
    align-items: center;
    gap: 10px;
    transform: translateX(120%); /* Başlangıçta ekran dışında */
    transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

#toast-notify.show {
    transform: translateX(0); /* Ekrana giriş yap */
}

/* Başarı İkonu */
.toast-icon {
    background: rgba(255, 255, 255, 0.2);
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}



/* --- MASAÜSTÜ MENÜ AYARLARI --- */
.nav-menu ul {
    display: flex;
    list-style: none;
    align-items: center;
}

.nav-menu ul li {
    margin-left: 30px;
}

.nav-menu ul li a {
    color: var(--soft-white);
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
    opacity: 0.85;
    position: relative;
    padding: 5px 0;
}

/* Masaüstünde Mobil Elemanları Kesin Olarak Gizle */
.sidebar-header, .sidebar-footer, .menu-toggle {
    display: none;
}

/* --- MOBİL GÖRÜNÜM (768px Altı) --- */
@media screen and (max-width: 768px) {
    .menu-toggle {
        display: block; /* Hamburger sadece mobilde gelir */
    }

   .nav-menu {
        position: fixed;
        top: 0;
        right: -100%;
        width: 85%;
        max-width: 320px;
        height: 100vh;
        background: #e5e5e5;
        transition: 0.5s cubic-bezier(0.77, 0.2, 0.05, 1.0);
        z-index: 2100;
        display: flex;
        flex-direction: column;
        box-shadow: -10px 0 30px rgba(0,0,0,0.1);
        
        /* KAYDIRMA ÖZELLİĞİ BURADA */
        overflow-y: auto; 
        -webkit-overflow-scrolling: touch; /* iOS cihazlarda akıcı kaydırma için */
    }

    /* Menü içindeki linklerin sığmama durumunda kayması için 
       nav-links'e ekstra alt boşluk verelim */
    .nav-links {
        padding: 10px 0 20px 0; 
        list-style: none;
        display: flex;
        flex-direction: column;
    }

    .nav-menu.active {
        right: 0;
    }

    .sidebar-header {
        display: flex; /* Mobilde görünür yap */
        padding: 15px;
        background: var(--dark-pastel-red);
        color: white;
        justify-content: space-between;
        align-items: center;
    }

    .sidebar-footer {
        display: block; /* Mobilde görünür yap */
        margin-top: auto;
        padding: 30px 25px;
        background: #f9f9f9;
        text-align: center;
    }

/* --- MODERN MOBİL LİNK DÜZENİ --- */
    .nav-menu ul {
        display: flex;
        flex-direction: column;
        gap: 5px; /* Linkler arasına boşluk ekleyerek ferahlık sağlar */
        padding: 20px 5px; /* Yanlardan içeride dursun */
        list-style: none;
    }

    .nav-menu ul li {
        width: 100%;
        margin: 0;
        border: none; /* Eski düz çizgiyi kaldırdık */
    }

    .nav-menu ul li a {
        display: flex;
        align-items: center;
        padding: 6px 20px;
        background: #ffffff; /* Kart arka planı */
        color: #333 !important;
        text-decoration: none;
        font-weight: 700; /* Daha belirgin yazılar */
        font-size: 1.1rem;
        border-radius: 16px; /* Yumuşak modern köşeler */
        transition: all 0.3s ease;
        border: 1px solid rgba(0,0,0,0.04); /* Çok hafif bir çerçeve */
        box-shadow: 0 3px 10px rgba(0,0,0,0.02); /* Hafif derinlik */
    }

    /* İkonları (fas, fab vb.) Özelleştirme */
    .nav-menu ul li a i {
   
        color: var(--dark-pastel-red);
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        margin-right: 15px;
        font-size: 1.1rem;
        transition: 0.3s;
    }

    /* Tıklama Efekti (Dokunmatik ekranlarda harika hissettirir) */
    .nav-menu ul li a:active {
        background: #fff5f6;
        transform: scale(0.96); /* Parmağınla bastığında hafifçe küçülür */
        border-color: rgba(142, 53, 74, 0.1);
    }

    .nav-menu ul li a:active i {
        background: var(--dark-pastel-red);
        color: #fff;
    }
}

/* --- YATAY KATEGORİ ŞERİDİ --- */
.category-scroll {
    background: #ffffff40;
    border-bottom: 1px solid #eee;
    padding: 5px 0;
    overflow: hidden;
    position: sticky;
    top: 40px;
    z-index: 1000;
}

.cat-items {
    display: flex;
    list-style: none;
    gap: 12px;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    padding: 0 20px;
}

.cat-items::-webkit-scrollbar { display: none; }

.cat-items li a {
    text-decoration: none;
    color: #d43c60;
    font-size: 13px;
    font-weight: 700;
    padding: 2px 8px;
    background: #f1f2f6;
    border-radius: 30px;
}

.cat-items li a.active, .cat-items li a:hover {
    background: var(--dark-pastel-red);
    color: white;
}

/* --- DİĞER STİLLER (Slider, Butonlar vb.) --- */
.card-text h3 { 
    font-family: 'Plus Jakarta Sans', sans-serif; 
    font-weight: 900; 
    font-size: 22px; 
    color: #8e354a;
    margin: 0 0 10px;
    text-transform: uppercase;
}

.btn-explore { 
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #8b002d; 
    text-decoration: none; 
    font-weight: 900; 
    font-size: 18px; 
    text-transform: uppercase;
}

.arrow-move {
    display: inline-block;
    animation: slideArrow 1.5s infinite ease-in-out;
}

@keyframes slideArrow {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(8px); }
}

.bar {
    display: block;
    width: 25px;
    height: 3px;
    margin: 5px auto;
    background-color: white;
}/* --- MASAÜSTÜNDE MOBİL ELEMANLARI GİZLE --- */
@media screen and (min-width: 769px) {
    .sidebar-header, 
    .sidebar-footer, 
    .close-sidebar,
    .menu-overlay {
        display: none !important;
    }
    
    /* Masaüstünde yan menü değil, normal menü gibi davranması için */
    .nav-menu {
        position: static !important;
        width: auto !important;
        height: auto !important;
        background: transparent !important;
        box-shadow: none !important;
        right: auto !important;
        display: block !important;
    }

    .nav-links {
        display: flex !important;
        flex-direction: row !important;
        padding: 0 !important;
    }

    .nav-links li {
        border: none !important;
    }
}




/* --- KALP ATIŞI EFEKTİ (Heartbeat) --- */
@keyframes heartbeat {
    0% { transform: scale(1); }
    15% { transform: scale(1.3); }
    30% { transform: scale(1); }
    45% { transform: scale(1.3); }
    70% { transform: scale(1); }
    100% { transform: scale(1); }
}
.fa-heart {
    animation: heartbeat 1.5s infinite;
    color: #e74c3c !important; /* Kalp kırmızı olsun */
    display: inline-block;
}

/* --- KİTAP SAYFA ÇEVİRME EFEKTİ --- */
@keyframes pageFlip {
    0% { transform: perspective(400px) rotateY(0); }
    50% { transform: perspective(400px) rotateY(-20deg); }
    100% { transform: perspective(400px) rotateY(0); }
}
.fa-book-open {
    animation: pageFlip 2s infinite ease-in-out;
    display: inline-block;
}

/* --- AİLE / GRUP SALLANMA EFEKTİ --- */
/* (Daha samimi ve canlı bir selamlaşma hissi verir) */
@keyframes familyNod {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}
.fa-user-friends, .fa-users {
    animation: familyNod 2s infinite ease-in-out;
    display: inline-block;
}@media screen and (min-width: 769px) {
    /* Menü Listesi Düzeni */
    .nav-menu ul {
        display: flex;
        gap: 35px; /* Linkler arası mesafeyi açarak ferahlık sağladık */
        align-items: center;
    }

    .nav-menu ul li a {
        font-size: 1rem; /* Yazıyı bir tık büyüttük */
        font-weight: 700; /* Yazıları kalınlaştırarak daha belirgin yaptık */
        color: var(--soft-white); /* Navbar koyu ise beyaz, açık ise koyu renk seçilmeli */
        text-transform: capitalize; /* Sadece baş harfler büyük (Daha modern durur) */
        padding: 10px 0;
        transition: all 0.3s ease;
        position: relative;
        opacity: 0.9;
    }

    /* Hover (Üzerine Gelince) Alt Çizgi Efekti */
    .nav-menu ul li a::after {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 2px;
        background-color: #ffffff; /* Alt çizgi rengi */
        transition: width 0.3s ease;
    }

    .nav-menu ul li a:hover {
        opacity: 1;
        transform: translateY(-2px); /* Hafif yukarı kalkma efekti */
    }

    .nav-menu ul li a:hover::after {
        width: 100%; /* Üzerine gelince çizgi boydan boya uzar */
    }

    /* Masaüstünde İkonların Durumu */
    .nav-menu ul li a i {
        margin-right: 8px;
        font-size: 1.1rem;
        vertical-align: middle;
    }
}/* Masaüstünde mobil listesini gizle */
@media screen and (min-width: 769px) {
    .mobile-only-view { display: none !important; }
    
    /* Masaüstü linklerini daha belirgin yapalım */
    .desktop-only-view {
        display: flex !important;
        gap: 30px;
    }
    .desktop-only-view a {
        font-weight: 800; /* Çok daha belirgin */
        font-size: 1.1rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }
}

/* Mobilde masaüstü listesini gizle */
@media screen and (max-width: 768px) {
    .desktop-only-view { display: none !important; }
    .mobile-only-view { display: block !important; }
}

/* --- PROFESYONEL FOOTER STİLLERİ --- */
.main-footer {
    background-color: #1a1a1a; /* Koyu antrasit - çok daha asil durur */
    color: #e0e0e0;
    padding: 60px 0 20px;
    margin-top: 80px;
    font-family: 'Poppins', sans-serif;
}

.footer-container {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 2fr 1fr 1fr; /* Bölüm genişlikleri */
    gap: 40px;
    padding: 0 20px;
}

.footer-section h3 {
    color: #fff;
    font-size: 1.5rem;
    margin-bottom: 20px;
    font-weight: 800;
}

.footer-section h3 span { color: rgba(255,255,255,0.5); font-weight: 300; }

.footer-section h4 {
    color: #fff;
    margin-bottom: 20px;
    font-size: 1.1rem;
    position: relative;
    padding-bottom: 10px;
}

/* Başlık Altındaki Kırmızı Çizgi */
.footer-section h4::after {
    content: '';
    position: absolute;
    left: 0; bottom: 0;
    width: 40px; height: 2px;
    background: #8e354a; 
}

.footer-section p {
    line-height: 1.8;
    font-size: 0.9rem;
    color: #bbb;
}

/* Linkler */
.footer-section ul { list-style: none; padding: 0; }
.footer-section ul li { margin-bottom: 12px; }
.footer-section ul li a {
    color: #bbb;
    text-decoration: none;
    transition: 0.3s;
    font-size: 0.9rem;
}
.footer-section ul li a:hover { color: #fff; padding-left: 5px; }

/* Sosyal Medya İkonları */
.footer-socials { display: flex; gap: 15px; margin-top: 20px; }
.footer-socials a {
    width: 40px; height: 40px;
    background: rgba(255,255,255,0.05);
    display: flex; align-items: center; justify-content: center;
    color: #fff; border-radius: 50%;
    transition: 0.3s;
}
.footer-socials a:hover { background: #8e354a; transform: translateY(-5px); }

/* Alt Telif Hakkı Kısmı */
.footer-bottom {
    text-align: center;
    margin-top: 50px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.05);
    font-size: 0.8rem;
    color: #777;
}

/* MOBİL UYUMLULUK */
@media (max-width: 768px) {
    .footer-container {
        grid-template-columns: 1fr; /* Mobilde her şey alt alta */
        text-align: center;
    }
    .footer-section h4::after { left: 50%; transform: translateX(-50%); }
    .footer-socials { justify-content: center; }
}
/* --- PAGE LAYOUT --- */
.page-container {
    max-width: 1200px;
    margin: 40px auto;
    padding: 0 20px;
}

.page-layout {
    display: grid;
    grid-template-columns: 2fr 1fr; /* 2 birim içerik, 1 birim sidebar */
    gap: 50px;
}

/* Sayfa Başlığı ve Çizgi */
.page-header h1 {
    font-size: 2.5rem;
    color: #1a1a1a;
    margin-bottom: 10px;
}

.title-line {
    width: 60px;
    height: 4px;
    background: #8e354a; /* Navbar renginle uyumlu */
    margin-bottom: 30px;
}

/* İçerik Alanı */
.entry-content p {
    line-height: 1.8;
    color: #444;
    margin-bottom: 20px;
    font-size: 1.1rem;
}

.lead {
    font-size: 1.3rem !important;
    font-weight: 500;
    color: #333 !important;
}

.page-featured-image {
    width: 100%;
    border-radius: 15px;
    margin: 20px 0;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

/* --- SIDEBAR --- */
.sidebar-widget {
    background: #fff;
    padding: 25px;
    border-radius: 15px;
    margin-bottom: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.03);
}

.sidebar-widget h4 {
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.sidebar-links { list-style: none; padding: 0; }
.sidebar-links li { margin-bottom: 12px; }
.sidebar-links li a {
    text-decoration: none;
    color: #666;
    transition: 0.3s;
    display: flex;
    align-items: center;
}

.sidebar-links li a i {
    font-size: 10px;
    margin-right: 10px;
    color: #8e354a;
}

.sidebar-links li a:hover { color: #8e354a; padding-left: 5px; }

/* Mobilde Düzeni Alt Alta Al */
@media (max-width: 992px) {
    .page-layout { grid-template-columns: 1fr; }
    .page-sidebar { order: 2; }
}.post-thumb {
  width: 40px;
  height: 40px;
  object-fit: cover;
  border-radius: 50%;
  
  /* Gölgeleri ve dönüşü yumuşatmak için geçiş */
  transition: box-shadow 0.4s ease-in-out, transform 0.2s;
  
  /* Resmin kendi etrafında dönmesi için (animasyonu eklediğimizde kullanılacak) */
  transform-origin: center center;
  
  cursor: pointer;
}

/* Üzerine Gelme Efekti: Dönen ve Parlayan Sınır */
.post-thumb:hover {
  /* Resmin kendisinin hafifçe büyümesi */
  transform: scale(1.1); 

  /* Dönen Halkayı Gölgelerle Taklit Etme */
  box-shadow: 
    /* Dışarıya doğru 4px mavi bir sınır */
    0 0 0 4px #1E90FF, 
    /* Yumuşak bir parlama (Glowing) */
    0 0 10px rgba(30, 144, 255, 0.7); 

  /* ANIMASYON Ekleme: Burası en kritik kısım */
  animation: spin 1s linear infinite; /* 1 saniyede tam tur, sürekli (infinite) ve doğrusal (linear) */
}

/* Fareden çekildiğinde animasyonu durdurma ve sıfırlama */
.post-thumb:not(:hover) {
  animation: none;
}/* Resim Çerçevesini Konumlandırma İçin Hazırla */
.quote-img-frame {
    position: relative; /* Butonun buna göre hizalanması için şart */
    overflow: hidden;
}

/* İndir Butonu Ana Stil */
.btn-download-overlay {
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.2); /* Yarı şeffaf beyaz */
    backdrop-filter: blur(8px); /* Cam efekti */
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 1.1rem;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

/* "Ben Buradayım" Canlılık Efekti (Hover) */
.btn-download-overlay:hover {
    background: #8e354a; /* Temanızın rengi */
    color: #fff;
    transform: scale(1.2) rotate(10deg); /* Büyü ve hafif dön */
    box-shadow: 0 0 20px rgba(142, 53, 74, 0.6); /* Dışa doğru parlama */
}

/* Sayfa yüklendiğinde hafifçe "nefes alma" animasyonu (Sürekli aktiflik için) */
.btn-download-overlay {
    animation: pulse-border 3s infinite;
}

@keyframes pulse-border {
    0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.4); }
    70% { box-shadow: 0 0 0 10px rgba(255, 255, 255, 0); }
    100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}/* 1. Söz Kartının Genel Canlılığı */
.quote-card-seo {
    margin-bottom: 60px;
    padding: 25px; /* Biraz iç boşluk ekledik */
    border-bottom: 1px solid #f1f1f1;
    border-radius: 15px; /* Köşeleri yumuşattık */
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    background: #fff;
}

/* Kartın üzerine gelince "Ben Buradayım" tepkisi */
.quote-card-seo:hover {
    transform: translateY(-8px); /* Havalanma efekti */
    box-shadow: 0 20px 40px rgba(142, 53, 74, 0.1); /* Hafif renkli gölge */
    border-bottom-color: #8e354a; /* Alt çizgi canlansın */
}

/* 2. Canlılık Sinyali (Kopyalamaya Hazır Yazısı) */
.live-status {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-right: auto; /* Yazıyı sola, butonu sağa yaslar */
    opacity: 0.6;
}

.live-status .dot {
    width: 8px;
    height: 8px;
    background-color: #2ecc71; /* Canlı Yeşil */
    border-radius: 50%;
    position: relative;
}

/* Yeşil noktanın etrafa ışık yayması (Pulse) */
.live-status .dot::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background: inherit;
    border-radius: inherit;
    animation: pulse-live 1.5s ease-out infinite;
}

@keyframes pulse-live {
    0% { transform: scale(1); opacity: 0.8; }
    100% { transform: scale(3.5); opacity: 0; }
}

/* 3. Kopyala Butonuna Işıltı */
.btn-copy-seo {
    font-size: 1.3rem; /* Simgeyi belirgin yapar */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--dark-pastel-red); /* Sitenizin ana rengini uygular */
    background: none; /* Arka planı temizler */
    border: none;     /* Kenarlığı kaldırır */
    transition: var(--transition); /* */
    line-height: 1;   /* Simge yüksekliğini sabitler */
    padding: 5px;
}

.btn-copy-seo:active {
    transform: scale(0.9); /* Tıklandığında basılma hissi verir */
}

.btn-copy-seo:hover {
    opacity: 0.8; /* Üzerine gelince hafif şeffaflık verir */
}


/* Sidebar Reklam Yerleşimi */
.ads-sidebar {
    position: fixed;
    top: 150px; /* Header'dan aşağıda başlaması için */
    width: 160px; /* Standart dikey reklam genişliği */
    height: 600px;
    z-index: 10;
}

.ads-left {
    left: calc(50% - 600px); /* 800px ana içerik + boşluk hesabı */
}

.ads-right {
    right: calc(50% - 600px);
}

.ads-label {
    font-size: 10px;
    color: #ccc;
    text-align: center;
    letter-spacing: 1px;
    margin-bottom: 5px;
}

/* Ekran küçüldüğünde reklamların yazının üstüne binmesini engeller */
@media (max-width: 1200px) {
    .ads-sidebar {
        display: none; /* Tablet ve mobilde gizle */
    }
}/* --- GENEL AYARLAR --- */
:root { --p-color: #2271b1; --s-color: #00d4ff; --text: #1d2327; --bg: #f0f2f5; }
body { background-color: var(--bg); color: var(--text); font-family: 'Inter', sans-serif; margin: 0; }

/* --- SLIDER CSS --- */
.main-slider-container { position: relative; height: 500px; width: 100%; overflow: hidden; background: #000; }
.slider-wrapper { position: relative; width: 100%; height: 100%; }
.slide { 
    position: absolute; inset: 0; width: 100%; height: 100%; 
    background-size: cover; background-position: center; 
    opacity: 0; visibility: hidden; transition: opacity 1s ease, visibility 1s;
    display: flex; align-items: center; justify-content: center; z-index: 1;
}
.slide.active { opacity: 1; visibility: visible; z-index: 2; }
.slide-content { text-align: center; color: #fff; max-width: 800px; padding: 0 20px; transform: translateY(30px); transition: 0.8s ease; }
.slide.active .slide-content { transform: translateY(0); }
.slide-content h2 { font-size: 3.5rem; font-weight: 800; margin: 15px 0; text-shadow: 0 2px 10px rgba(0,0,0,0.5); }
.slider-dots { position: absolute; bottom: 30px; left: 50%; transform: translateX(-50%); z-index: 10; display: flex; gap: 10px; }
.dot { width: 12px; height: 12px; background: rgba(255,255,255,0.3); border-radius: 50%; cursor: pointer; transition: 0.3s; }
.dot.active { background: #fff; width: 35px; border-radius: 20px; }

/* --- REKLAM VE LAYOUT --- */
.dynamic-layout { display: flex; gap: 25px;  max-width: 1550px; padding: 0 5px; align-items: flex-start; }
.side-ad { flex: 0 0 160px; position: sticky; top: 20px; min-height: 600px; background: rgba(0,0,0,0.02); border: 1px dashed #ccc; display: flex; align-items: center; justify-content: center; color: #999; font-size: 12px; }
.content-center { flex: 1; min-width: 0; }
.content-desc-kategori { display: flex; gap: 25px; margin: 15px auto; max-width: 1550px; padding: 0 5px; align-items: flex-start; }
/* --- CANLI KATEGORİ KUTULARI --- */
.vibrant-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(390px, 1fr)); gap: 15px; }
.category-item-container { position: relative; padding-top: 15px; }
.category-item-container {
    position: relative;
    max-height: 300px;
    overflow: hidden;
}

/* TREND - Soft Mor Cam Efekti */
.tag-purple {
    background: rgba(148, 69, 249, 0.75); 
    box-shadow: 0 10px 25px rgba(148, 69, 249, 0.35);
}

/* NEW - Canlı & Soft Kırmızı Cam Efekti */
.tag-red {
    /* Koyu Pastel Kırmızı (Deep Coral / Rose) */
    background: rgba(198, 62, 62, 0.82); 
    
    /* Derinlik katan gölge */
    box-shadow: 0 10px 25px rgba(198, 62, 62, 0.4);
    
    /* Camın kenar parlaması koyu tonda daha klas durur */
    border: 1px solid rgba(255, 255, 255, 0.35) !important;
}

/* Koyu pastel kırmızıda blur etkisi daha "mistik" durur */
.tag-red {
    backdrop-filter: blur(15px) saturate(160%);
    -webkit-backdrop-filter: blur(15px) saturate(160%);
}

/* Ortak Özellikler (Hepsinde çalışır) */
.cat-floating-tag { 
    position: absolute; top: 0px; left: 20px; z-index: 10;
    backdrop-filter: blur(12px) saturate(200%); /* Kırmızıda doygunluğu artırdık */
    -webkit-backdrop-filter: blur(12px) saturate(200%);
    color: #ffffff; padding: 6px 12px; border-radius: 10px; 
    font-size: 11px; font-weight: 800; text-transform: uppercase;
    font-family: 'Plus Jakarta Sans', sans-serif; letter-spacing: 1px;
    display: inline-flex; align-items: center; justify-content: center;
    overflow: hidden;
    animation: glassFloat 3s infinite ease-in-out;
}

/* Işık süzülmesi efekti kırmızı üzerinde çok şık durur */
.cat-floating-tag::before {
    content: ""; position: absolute; top: 0; left: -150%;
    width: 50%; height: 100%;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.6), transparent);
    transform: skewX(-25deg); animation: glassShine 4s infinite;
}


/* Animasyon Tanımları */
@keyframes glassShine {
    0% { left: -150%; }
    20% { left: 150%; } /* Işık hızlıca geçer */
    100% { left: 150%; } /* Sonra bekler */
}

@keyframes glassFloat {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-3px); } /* Çok hafif yukarı-aşağı hareket */
}

.modern-card { 
    display: flex; background: #fff; border-radius: 20px; overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.04); border: 1px solid rgba(0,0,0,0.05);
    height: 150px; transition: 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.modern-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.1); border-color: var(--p-color); }

.card-img { flex: 0 0 40%; position: relative; overflow: hidden; }
.card-img img { width: 100%; height: 100%; object-fit: cover; transition: 0.6s; }

.card-text { flex: 1; padding: 15px; display: flex; flex-direction: column; justify-content: center; }

.card-text p { color: #646970; font-size: 14px; line-height: 1.9; margin-bottom: 1px; }


/* --- BAŞLIK --- */
.modern-title { font-size: 28px; font-weight: 800; margin: 0; }
.glow-line { width: 80px; height: 5px; background: linear-gradient(90deg, var(--p-color), transparent); border-radius: 10px; margin: 10px 0 40px; }

/* --- MOBİL DÜZENLEMELER (YENİ) --- */
@media (max-width: 850px) {
    .main-slider-container { height: 320px; } /* Slider yüksekliği küçüldü */
    .slide-content h2 { font-size: 1.8rem; } /* Slider başlığı küçüldü */
    .slide-content .btn-main { padding: 8px 20px; font-size: 14px; }
    
    .modern-title { font-size: 22px; } /* Sayfa başlığı küçüldü */
    
    .vibrant-grid { grid-template-columns: 1fr; gap: 20px; }
    .modern-card { height: auto; flex-direction: column; }
    .card-img { height: 160px; }
    .card-text { padding: 15px; }

    .card-text p { font-size: 13px; }
}
 /* Temel Layout - Box kaldırıldı */
    .page-fluid-main {
        max-width: 800px;
        margin: 10px auto;
        padding: 0 10px;
        min-height: 80vh;
    }

    /* Başlık ve Linear Çizgi */
    .seo-header {
      text-align: center;
    }

    .breadcrumb {
        font-size: 0.9rem;
        color: #888;
        margin-bottom: 15px;
    }

    .breadcrumb a { color: #8e354a; text-decoration: none; }

    .seo-header h1 {
    font-size: 2.8rem;
    font-weight: 900;
    color: #2c3e50;
    text-transform: uppercase;
    letter-spacing: -1px;
  word-spacing: -8px;
    background: linear-gradient(135deg, #8e354a 0%, #b9294b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; /* Yazıya gradyan verir */
    position: relative;
    display: inline-block;
}

   .linear-line {
    width: 100%;
    
    height: 3px;
    /* Sol: Transparent -> Orta: Renk -> Sağ: Transparent */
    background: linear-gradient(to right, transparent, #a607c1, transparent);
    border-radius: 50px;
    position: relative;
    margin: 10px 0;
}

    /* Söz Kartları - Modern ve Sade */
    .quote-card-seo {
        margin-bottom: 60px;
        padding-bottom: 30px;
        border-bottom: 1px solid #f1f1f1;
    }

    /* Resim Düzeni */
    .quote-img-frame {
        width: 100%;
       height: auto;
        border-radius: 12px;
        overflow: hidden;
        margin-bottom: 10px;
		margin-TOP: 10px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.05);
    }

    .quote-img-frame img {
        width: 100%;
        height: auto;
        display: block;
        object-fit: contain; /* Resmin tamamı sığar */
    }

    /* Metin Alanı */
    .quote-body-seo {
        display: flex;
        flex-direction: column;
        gap: 15px;
    }

.quote-text-seo {
    font-size: 1.4rem;
    line-height: 1.8;
    color: #333;
    font-family: 'Playfair Display', 'Georgia', serif;
    
    /* --- BOŞLUK VE AYRIM --- */
    margin-bottom: 3px; /* Her sözün altına 30px boşluk bırakır */
    padding: 2px 2px;   /* İç taraftan ferahlık sağlar */
    
    /* Tasarım Detayları */
    border-left: 6px solid var(--quote-color, #ce0e3b);
    background: #fff; /* Temiz bir arka plan */
    border-radius: 0 12px 12px 0; /* Sağ köşeleri yumuşatır */
    
    /* Hafif derinlik hissi veren gölge */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
    
    /* Geçiş efekti */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
    display: block; /* Boşlukların düzgün çalışması için */
}

/* Üzerine gelince (Hover) hafifçe canlanması için */
.quote-text-seo:hover {
    transform: translateX(5px); /* Sağa doğru küçük bir hareket */
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
}

    /* Kopyala Butonu - Sağa Yaslı */
    .quote-actions {
        display: flex;
        justify-content: flex-end;
    }



    /* Reklam Alanı */
    .ad-container {
        margin: 40px 0;
        text-align: center;
        background: #fafafa;
        padding: 20px;
        border-radius: 10px;
    }

    @media (max-width: 600px) {
        .seo-header h1 { font-size: 1.5rem;font-weight: 900; }
        .quote-text-seo { font-size: 0.9rem; }
    }
@media (max-width: 1300px) { .side-ad { display: none; } }

/* Yükleniyor Belirteci */
#load-more-status { text-align: center; padding: 20px; font-weight: 600; color: var(--p-color); display: none; }
.mobile-only-card {
    display: none !important; /* Masaüstünde kesinlikle gizle */
}

/* --- 1. MASAÜSTÜ AYARLARI (Varsayılan) --- */
.mobile-only-card {
    display: none !important; /* Bilgisayarda asla çıkmaz */
}

/* --- 2. CANLI (ANIMATED) ETİKETLER --- */
.category-item-container { position: relative; }

.cat-floating-tag {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 20;
    padding: 3px 10px;
    border-radius: 4px;
    font-size: 9px;
    font-weight: 800;
    color: #fff;
    text-transform: uppercase;
    /* Parlama ve Hareket Animasyonu */
    animation: tagPulseGlow 1.5s infinite alternate;
}

.tag-purple { background: #a607c1; box-shadow: 0 0 10px rgba(166, 7, 193, 0.6); }
.tag-red { background: #ff3b30; box-shadow: 0 0 10px rgba(255, 59, 48, 0.6); }

@keyframes tagPulseGlow {
    from { transform: scale(1); opacity: 0.9; filter: brightness(1); }
    to { transform: scale(1.08); opacity: 1; filter: brightness(1.2); }
}

/* --- 3. MOBİL TASARIM (600px ve Altı) --- */
@media (max-width: 850px) {
    /* Masaüstünü gizle, mobili aç */
    .desktop-only { display: none !important; }
    .mobile-only-card { display: block !important; text-decoration: none; }

    /* Grid: Yatay genişliği artırılmış 2'li yapı */
    .vibrant-grid {
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 8px !important;
     
    }

    /* Kutu İçine Sığdırılmış Resim ve Yatay Form */
    .m-card-img {
        position: relative;
        width: 100%;
        height: 150px; /* Sabit Yatay Dikdörtgen Yüksekliği */
        border-radius: 10px;
        overflow: hidden;
        background: #eee;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    }

    .m-card-img img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* Resmi kutuya tam sığdırır, boşluk bırakmaz */
        display: block;
    }

    /* Alt Beyaz Bar */
    .m-card-bar {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        background: rgba(255, 255, 255, 0.98);
        padding: 1px 0;
        text-align: center;
        border-top: 1px solid rgba(0,0,0,0.05);
    }

    .m-card-title {
        margin: 0;
        color: #910085;
        font-size: 1.2rem;
        font-weight: 800;
        text-transform: uppercase;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* Dokunma Overlay */
    .m-card-overlay {
        position: absolute;
        inset: 0;
        background: rgba(166, 7, 193, 0.25);
        display: flex;
        align-items: center;
        justify-content: center;
        opacity: 0;
        transition: 0.2s;
    }

    .mobile-only-card:active .m-card-overlay {
        opacity: 1;
    }
}.m-card-overlay-ok .arrow {
    transition: transform 0.35s cubic-bezier(.4,0,.2,1);
}a {
    text-decoration: none;
}/* --- PREMIUM MODAL TASARIMI --- */
.search-modal {
    position: fixed;
    top: 0; left: 0; width: 100%; height: 100%;
    z-index: 10000;
    display: none; /* JS ile active olunca flex olacak */
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.search-modal.active { display: flex; }

/* Arka planı hafifçe karartma */
.modal-overlay {
    position: absolute;
    top: 0; left: 0; width: 100%; height: 100%;
    background: rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(5px); /* Arka planı bulandırır */
}

/* Cam Kutu (Modalın kendisi) */
.modal-glass-card {
    position: relative;
    width: 100%;
    max-width: 600px;
    background: rgba(255, 255, 255, 0.85); /* Yarı saydam beyaz */
    backdrop-filter: blur(15px); /* Kendi içini bulandırır (cam efekti) */
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 30px;
    padding: 40px;
    box-shadow: 0 25px 50px rgba(0,0,0,0.15);
    transform: scale(0.9);
    transition: 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.search-modal.active .modal-glass-card {
    transform: scale(1);
}

/* Modern Input Alanı */
.modal-search-form-modern {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.input-group {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.5);
    border: 1px solid #ddd;
    border-radius: 15px;
    padding: 5px 20px;
}

.input-group i { color: #f10a40; font-size: 1.2rem; }

.input-group input {
    border: none;
    background: transparent;
    padding: 15px;
    width: 100%;
    outline: none;
    font-size: 1.1rem;
    font-weight: 600;
}

/* Cam Efektli Buton */
.glass-search-btn {
    background: #f10a40;
    color: white;
    border: none;
    padding: 15px;
    border-radius: 15px;
    font-weight: 800;
    cursor: pointer;
    transition: 0.3s;
    box-shadow: 0 10px 20px rgba(241, 10, 64, 0.2);
}

.glass-search-btn:hover {
    background: #d10836;
    transform: translateY(-2px);
}

.modal-close-minimal {
    position: absolute;
    top: 15px; right: 20px;
    font-size: 2rem;
    cursor: pointer;
    color: #666;
}/* Arama Kelimesi Vurgusu */
mark {
    background: linear-gradient(120deg, rgba(241, 10, 64, 0.2) 0%, rgba(241, 10, 64, 0.1) 100%);
    color: #f10a40;
    padding: 0 3px;
    font-weight: 800;
    border-radius: 4px;
}

/* Sonuç Bulunamadı Kutusu (Glass) */
.no-results-glass {
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 20px;
    padding: 60px 20px;
    text-align: center;
    max-width: 600px;
    margin: 50px auto;
    box-shadow: 0 15px 35px rgba(0,0,0,0.05);
}

.no-results-glass i {
    font-size: 4rem;
    color: #ddd;
    margin-bottom: 20px;
}

.no-results-glass h2 {
    color: #333;
    font-weight: 800;
    margin-bottom: 10px;
}

.no-results-glass p {
    color: #777;
    margin-bottom: 25px;
}/* Ana Cam Kart Konteyneri */
.hero-glass-card {
    /* Cam Efekti */
    background: rgba(255, 255, 255, 0.75); /* Yarı saydam beyaz */
    backdrop-filter: blur(15px); /* Arka planı bulanıklaştırma */
    -webkit-backdrop-filter: blur(15px); /* Safari desteği */
    
    /* Kenarlık ve Gölge */
    border: 1px solid rgba(255, 255, 255, 0.4); /* İnce beyaz kenarlık */
    border-radius: 30px; /* Yumuşak köşeler */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05); /* Derinlik hissi veren hafif gölge */
    
    /* Hizalama ve Boşluklar */
    padding: 60px 40px;
    max-width: 800px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

/* Kart İçindeki Büyük Başlık */
.premium-title {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 10px;
    color: #1a1a1a;
    letter-spacing: -1px;
    /* Şık bir renk geçişi (Opsiyonel) */
    background: linear-gradient(135deg, #1a1a1a 30%, #f10a40 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Başlık Altındaki Modern Çizgi */
.modern-linear-line {
    width: 50px;
    height: 5px;
    background: #f10a40; /* Marka renginiz */
    margin: 25px auto;
    border-radius: 50px;
}

/* Kart İçindeki Alt Açıklama Metni */
.premium-desc {
    font-size: 1.2rem;
    color: #4a4a4a;
    line-height: 1.7;
    font-weight: 500;
    max-width: 550px;
    margin: 0 auto;
}

/* Vurgulu (Strong) Metinler İçin */
.premium-desc strong {
    color: #f10a40;
    font-weight: 700;
}.pagination-container { display: flex; justify-content: center; gap: 8px; margin: 50px 0; }
.pg-link { width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; background: #fff; border: 1px solid #eee; border-radius: 8px; text-decoration: none; color: #666; font-weight: 700; transition: 0.3s; }
.pg-link.active { background: #a607c1; color: #fff; border-color: #a607c1; box-shadow: 0 4px 12px rgba(166, 7, 193, 0.2); }
.pg-link:hover:not(.active) { border-color: #a607c1; color: #a607c1; }
.category-hero-wrapper {
 padding: 20px 10px;
    display: flex;
    justify-content: center;
}

/* Header Kartı: Yatayda komple kaplamaz, şık bir kutu gibi durur */
.hero-glass-card {
    background: #ffffff;
   
    border-radius: 24px; /* Oval köşeler */
    box-shadow: 0 10px 25px rgba(0,0,0,0.03); /* Hafif gölge */
    border: 1px solid #f1f5f9;
    max-width: 1550px;
    width: 100%;
    text-align: center;
    position: relative;
}

/* H1 Başlık */
.premium-title {
    font-size: 2.4rem;
    font-weight: 900;
    color: #5c0606d9;
    letter-spacing: -1px;
    margin-bottom: -3px; /* Çizgiyle arasındaki mesafe artık buradan kontrol ediliyor */
    line-height: 1.2;
}

/* MODERN LINER ÇİZGİ: Parlama efektli ve estetik */
.modern-linear-line {
   
    height: 3px;
    /* İki ucu şeffaf, ortası renkli geçiş */
    background: linear-gradient(90deg, 
        transparent 0%, 
        #f10a40 20%, 
        #7900c5 80%, 
        transparent 100%
    );
    margin: 0 auto 10px;
    border-radius: 100px;
    position: relative;
    overflow: hidden;
}
.hero-glass-card {
    display: flex;
    flex-direction: column;
    align-items: center; /* İçindeki her şeyi ortalar */
}

.modern-linear-line {
    width: 80%; /* Kendi içinde bulunduğu alanın (artık başlık alanı) %80'i */
    align-self: stretch; /* Veya belirli bir genişlik */
}
/* Parlama efektini de bu yeni şeffaf yapıya uyarlayalım */
.modern-linear-line::after {
    content: '';
    position: absolute;
    top: 0; 
    left: -100%;
    width: 100%; 
    height: 100%;
    /* Parlamanın uçlarda keskin görünmemesi için onu da yumuşatıyoruz */
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255,255,255,0.6), 
        transparent
    );
    animation: slide-glow 3s infinite ease-in-out;
}

@keyframes slide-glow {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* Açıklama */
.premium-desc {
    font-size: 1.1rem;
    color: #64748b;
    line-height: 1.6;
    margin: 0;font-weight: 900;
}

/* --- MOBİL UYUMLULUK --- */
@media (max-width: 768px) {
    .category-hero-wrapper {
        padding: 20px 10px;
    }
    .hero-glass-card {
      
        border-radius: 20px;
    }
    .premium-title {
        font-size: 1.8rem;
    }
    .premium-desc {
        font-size: 0.95rem;
    }
}
.main-title {
    font-size: 32px;
    font-weight: 800;
    color: #222;
    margin-bottom: 15px; /* Altındaki çizgi/açıklama ile mesafe */
    text-transform: uppercase;
    letter-spacing: -0.5px;
}
.title-separator {
    width: 60px;
    height: 4px;
    background: #a607c1;
    margin: 0 auto 20px;
    border-radius: 2px;
}
.category-desc {
    font-size: 18px;
    color: #666;
    line-height: 1.6;
    margin: 0;
}

/* --- KARTLAR: TAMAMI TIKLANABİLİR --- */
.full-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.modern-card {
    background: #fff;
    border-radius: 12px;
    border: 1px solid #efefef;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    height: 100%;
    position: relative;
}

.modern-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1);
    border-color: #a607c1;
}

.card-img-box img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.card-body {
    padding: 20px;
}

.card-body h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
}

.card-body p {
    font-size: 0.9rem;
    color: #777;
    margin-bottom: 15px;
}

.card-action {
    font-size: 0.8rem;
    font-weight: 700;
    color: #a607c1;
    display: flex;
    align-items: center;
    gap: 5px;
}

/* --- ETİKETLER --- */
.floating-tag {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 5px 12px;
    border-radius: 20px;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    z-index: 10;
}
.tag-purple { background: #a607c1; }
.tag-red { background: #ff4757; }

/* Mobilde reklamları gizle veya düzenle */
@media (max-width: 768px) {
    .side-ad { display: none; }
}/* Linkin alt çizgisini kaldır ve renk değişimini engelle */
.modern-card-anchor {
    text-decoration: none !important; /* Alt çizgiyi kesin olarak kaldırır */
    color: inherit; /* Yazı renginin mavi olmasını engeller, ana rengi korur */
    display: block; /* Kartın tamamını kaplaması için */
}

.modern-card-anchor:hover {
    text-decoration: none !important;
}

/* Eğer buton kısmında da çizgi çıkıyorsa */
.btn-explore {
    text-decoration: none;
}/* Logo Alanı */
.logo a {
    text-decoration: none;
    display: inline-block;
}

.neon-text {
    font-family: 'Bodoni Moda', serif;
    font-size: 2rem;
    font-weight: 600;
    font-style: italic;
    letter-spacing: -1px;
    
    background: linear-gradient(
        to bottom, 
        #BF953F 0%,   
        #FCF6BA 25%,  
        #B38728 50%,  
        #FBF5B7 75%,  
        #AA771B 100%  
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    
    position: relative;
    display: inline-block;
    
    /* BOŞLUK AYARI BURASI */

    
    filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.6));
    animation: textFlashGlow 6s infinite;
    transition: 0.5s ease;
}

.neon-text::after {
    content: '';
    position: absolute;
    bottom: 0; 
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(
        90deg, 
        rgba(191, 149, 63, 0) 0%, 
        #FCF6BA 50%, 
        rgba(170, 119, 27, 0) 100%
    );
    border-radius: 50px;
    box-shadow: 0 2px 10px rgba(179, 135, 40, 0.6);
}

@keyframes textFlashGlow {
    0%, 85%, 100% { filter: brightness(1) drop-shadow(0 4px 6px rgba(0, 0, 0, 0.6)); }
    92% { filter: brightness(1.6) drop-shadow(0 0 20px rgba(252, 246, 186, 0.9)); }
    96% { filter: brightness(1.2) drop-shadow(0 0 10px rgba(252, 246, 186, 0.4)); }
}

.logo a:hover .neon-text {
    filter: brightness(1.2) drop-shadow(0 0 15px rgba(252, 246, 186, 0.7)); 
    transform: scale(1.02);
}   
 .seo-header h2 {
    font-size: 1.8rem;
    font-weight: 900;
    color: #2c3e50;
    text-transform: uppercase;
    letter-spacing: -1px;
  
    background: linear-gradient(135deg, #8e354a 0%, #b9294b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; /* Yazıya gradyan verir */
    position: relative;
    display: inline-block;
}.seo-header h3 {
    font-size: 2.0rem;
    font-weight: 900;
    color: #2c3e50;
    text-transform: uppercase;
    letter-spacing: -1px;
  
    background: linear-gradient(135deg, #8e354a 0%, #b9294b 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent; /* Yazıya gradyan verir */
    position: relative;
    display: inline-block;
}
   @media (max-width: 600px) {
        .seo-header h2 { font-size: 1.2rem; }
         .seo-header h3 { font-size: 1.3rem; }
    }@media (min-width: 1024px) {
		.card-text p { color: #646970; font-size: 14px; line-height: 1.9; margin-bottom: 1px; }
  .vibrant-grid {
    grid-auto-rows: 200px; /* Tüm satırlar otomatik olarak 200px olur */
	
  }
}

.card-text h3 {
    font-family: 'Syne', sans-serif;
    font-weight: 800;
    text-transform: uppercase;
    color: #c44569; /* İstediğin sabit renk */
    
    /* Font boyutu ayarları */
    font-size: 1.375rem; /* 22px'e eşittir (1rem = 16px ise) */
    line-height: 1.2;
    
    /* Şıklık katacak eklemeler */
    margin: 0 0 0.625rem; /* 10px alt boşluk rem cinsinden */
    letter-spacing: 0.03em; /* Harflerin birbirine yapışmasını engeller */
}/* Genel Menü Linki (Hiçbir süsleme yok, sade ve şık) */


/* AKTİF İŞARETİ (İkonun kendisi) */
.indicator {
    color: #fffff; /* Seçtiğin efsane renk */
    font-weight: 900;
    font-size: 1.1rem;
    
    /* BOŞLUK AYARLARI */
    margin-left: 5px;  /* Sol taraftan (kenardan) boşluk */
    margin-right: 5px; /* Sağ taraftan (yazıdan) boşluk */
    
    /* Canlılık katması için ekran kartını yormayan küçük bir hareket */
    display: inline-block; /* Animasyonun çalışması için gerekli */
    animation: vibrantPulse 2s infinite ease-in-out;
}

/* Okun hafifçe sağa sola gidip gelerek "buradasın" demesi */
@keyframes vibrantPulse {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(5px); }
}

/* Linkin genel yapısı */
.nav-link-item {
    display: flex;
    align-items: center;
    text-decoration: none;
    padding: 10px 0;
}


/* 2. Alt Satır Düzeni */
.card-bottom {
    display: flex;
    justify-content: space-between; /* Keşfet solda, Etiket sağda */
    align-items: center;
    margin-top: auto;               /* En alta iter */
    padding-top: 15px;
    border-top: 1px solid rgba(0,0,0,0.05);
}
/* Genel Tag Yapısı */
.m-tag-editor {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 6px;
    border-radius: 50px;
    font-size: 0.75rem;
    font-weight: 800;
    color: #fff;
    text-transform: uppercase;

    position: relative;
    overflow: hidden;
}

/* Parlama katmanı */
.m-tag-editor::after {
    content: "";
    position: absolute;
    top: 0;
    left: -75%;
    width: 50%;
    height: 100%;
    background: linear-gradient(
        120deg,
        rgba(255,255,255,0) 0%,
        rgba(255,255,255,0.6) 50%,
        rgba(255,255,255,0) 100%
    );
    transform: skewX(-25deg);
    animation: shine 2.5s infinite;
}

@keyframes shine {
    0% { left: -75%; }
    100% { left: 125%; }
}

/* 1. Editörün Seçimi (Senin o efsane rengin #d43c60) */
.tag-editor {
    background: linear-gradient(135deg, #d43c60 0%, #ff5e7e 100%);
    box-shadow: 0 4px 10px rgba(212, 60, 96, 0.3);
}

/* 2. Yeni Etiketi (Canlı bir Turuncu/Sarı tonu) */
.tag-new {
    background: linear-gradient(135deg, #f0932b 0%, #ffbe76 100%);
    box-shadow: 0 4px 10px rgba(240, 147, 43, 0.3);
}

/* 3. Popüler Etiketi (Mor/Mavi tonu) */
.tag-popular {
    background: linear-gradient(135deg, #686de0 0%, #4834d4 100%);
    box-shadow: 0 4px 10px rgba(104, 109, 224, 0.3);
}


/* Modern Sayfalama Kapsayıcı */
.pagination-wrapper {
    margin: 20px 0 20px 0;
    text-align: center;
    padding: 0 15px;
}

/* Yönlendirici Yazı Stili */
.pagination-info-text {
    font-size: 13px;
         color: #ce0e3b;
    margin-bottom: 15px;
    font-weight: 500;
    text-transform: uppercase; /* Kurumsal bir hava katar */
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}


/* Sayfalama Çubuğu */
.pagination-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    padding: 8px 12px;
    border-radius: 50px;
    box-shadow: 0 5px 10px rgba(0,0,0,0.05);
    border: 1px solid #f0f0f0;
}
.pagination-center {
    display: flex;
    justify-content: center;
    width: 100%;
  
}
.page-link {
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 38px;
    height: 38px;
    text-decoration: none;
    color: #444;
    font-size: 14px;
    font-weight: 600;
    border-radius: 50%;
    transition: all 0.25s ease;
}

.page-link:hover:not(.active) {
    background-color: #f0f0f0;
    color: #000;
    transform: translateY(-2px);
}

.page-link.active {
    background-color: #333;
    color: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.page-dots {
    color: #bbb;
    padding: 0 2px;
}

/* Mobil için yazı boyutunu küçültme */
@media (max-width: 480px) {
    .pagination-info-text {
        font-size: 11px;
    }
    .page-link {
        min-width: 20px;
        height: 22px;
    }
	.pagination-info-text {
    font-size: 13px;
    color: #ce0e3b;
    margin-bottom: 5px;
    font-weight: 600;
    text-transform: uppercase; /* Kurumsal bir hava katar */
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}
.pagination-nav {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
  
    border-radius: 50px;
    box-shadow: 0 5px 8px rgba(0,0,0,0.05);
    border: 1px solid #f0f0f0;
}
.pagination-center {
    display: flex;
    justify-content: center;
    width: 100%;
  
}
}
.more-button-container {
    text-align: center;
    margin: 5px 0;
    clear: both;
}

/* Devamını Keşfet Butonu */
.btn-continue-reading {
    display: inline-block;
    padding: 15px 35px;
    background-color: #2c3e50; /* Koyu gri/mavi tonu */
    color: #ffffff !important;
    border-radius: 50px;
    text-decoration: none;
    font-weight: bold;
    border: 2px solid #34495e;
    transition: all 0.3s ease;
    font-size: 16px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

/* Butonun üzerine gelince olacaklar */
.btn-continue-reading:hover {
    background-color: #34495e;
    border-color: #2c3e50;
    transform: translateY(-2px); /* Hafif yukarı kalkma efekti */
    box-shadow: 0 6px 12px rgba(0,0,0,0.15);
    color: #fff;
}

/* Mobilde butonun çok genişlememesi için */
@media (max-width: 480px) {
    .btn-continue-reading {
        padding: 12px 25px;
        font-size: 14px;
        width: 80%; /* Mobilde daha dolgun dursun */
    }
}