@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
/* Inter Regular (Normal Yazılar) */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Inter Medium (Biraz daha dolgun yazılar) */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Inter SemiBold (Alt başlıklar için ideal) */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Inter Bold (Ana Başlıklar) */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
/* Inter Italic */
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-ExtraBold.ttf') format('truetype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('fonts/Inter_28pt-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
/* --- CSS DEĞİŞKENLERİ --- */
:root {
--primary: #bc1d45;
--accent: #e21d24;
--bg-body: #f9fafb;
--bg-card: #ffffff;
--text-main: #111827;
--text-muted: #6b7280;
--border: #f1f1f1;
--shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
--radius-lg: 1rem;
--radius-xl: 1.5rem;
--transition: all 0.2s ease;
}
a{text-decoration: none;}
/* --- RESET & BASE --- */
* { margin: 0; padding: 0; box-sizing: border-box; }
body {font-family: 'Inter', sans-serif;  background-color: var(--bg-body);  color: var(--text-main); overflow: hidden; display: flex; height: 100vh; overflow-x: hidden; overflow-y: auto;}
.section-title { font-size: 1.25rem; font-weight: 800; margin-bottom: 1.5rem; border-left: 4px solid var(--accent); padding-left: 1rem; }


/* --- SIDEBAR --- */
#main-sidebar{width:360px;background:transparent;display:flex;flex-direction:column; justify-content: center; z-index:2000; transition:all 0.4s cubic-bezier(0.4,0,0.2,1); position:fixed;left:0px; top:30px; padding:30px 60px; height:calc(100vh - 60px); border-right: 1px solid #d1d1d1;}
.sidebar-header{background:transparent;display:flex;align-items:center;height:60px;padding:0 0 0 10px;}
.bundle-logo{display:flex;align-items:center;gap:12px;text-decoration:none;}
.logo-icon{width:38px;height:38px;background:#e21d24;color:#ffffff;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:1.4rem;border-radius:10px;}
.logo-text h1{font-size:1.2rem;font-weight:800;color:#1a1a1b;margin:0;letter-spacing:-0.5px;text-transform:uppercase;line-height:1;}
.sidebar-dark-section{background:#1a1a1b;display:flex;flex-direction:column; border-radius:18px;overflow:hidden; box-shadow:0 10px 40px rgba(0,0,0,0.2);margin-top:10px;}
.sidebar-menu-container{padding:32px 16px;flex:1;overflow-y:auto;}
.sidebar-menu-container::-webkit-scrollbar{display:none;}
.nav-link{display:flex;align-items:center;gap:14px;padding:12px 16px;margin-bottom:4px;text-decoration:none;color:#a1a1a6;font-family:'Inter',sans-serif;font-size:0.85rem;font-weight:600;border-radius:12px;transition:all 0.2s ease;}
.nav-link i{font-size:1.1rem;width:20px;text-align:center;color:#636366;}
.nav-link:hover{background:#2c2c2e;color:#ffffff;}
.nav-link.active{background:#2c2c2e;color:#fff;}
.nav-link.active i{color:#fff;}
.sidebar-footer{margin-top:auto;padding:20px 24px;border-top:1px solid #2c2c2e;}
.night-mode-area{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;color:#ffffff;font-size:0.75rem;font-weight:600;text-transform:uppercase;}
.switch{position:relative;display:inline-block;width:38px;height:20px;}
.switch input{opacity:0;width:0;height:0;}
.slider-toggle{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#3a3a3c;transition:.4s;border-radius:20px;}
.slider-toggle:before{position:absolute;content:"";height:16px;width:16px;left:2px;bottom:2px;background-color:white;transition:.4s;border-radius:50%;}
input:checked + .slider-toggle{background-color:#5d5dff;}
input:checked + .slider-toggle:before{transform:translateX(18px);}
.footer-links-small{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:10px;}
.footer-links-small a{font-size:11px;color:#636366;text-decoration:none;font-weight:500;}
.footer-links-small a:hover{color:#ffffff;}
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:1500;}

.mobile-toggle { display: none; padding: 0.5rem; background: #fff; border: 1px solid var(--border); border-radius: 0.5rem; color: var(--accent); cursor: pointer; }
.govde{flex:1; margin-left:360px; padding:30px 60px 30px 60px; min-height:100vh;}
.header-top { height:60px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 2rem; flex-wrap: wrap; }
@media (max-width: 1024px) {
    #main-sidebar{width:240px; left:-300px;top:0;height:100vh; margin:0; padding:0 1rem;}
    #main-sidebar.open{left:0;background:#1a1a1b;}
    #main-sidebar.open .sidebar-header .logo-text h1{color:#fff;}
    .govde{margin-left:0;padding:80px 16px 30px 16px;}
    .mobile-toggle{display:flex;}
    .sidebar-overlay.active{display:block;}

.sidebar { position: fixed; transform: translateX(-100%); height: 100%; }
.sidebar.open { transform: translateX(0); }
.sidebar-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.4); z-index: 900; }
.sidebar-overlay.show { display: block; }
.top-info-bar { order: -1; width: 100%; justify-content: center; margin-bottom: 1rem; }
  .header-top{height: auto;}
}


/*MANSET*/
    .manset-container {width: 100%; display: block; height: 380px; margin: 0 0 30px 0; position: relative; overflow: hidden; border-radius: 12px; font-family: 'Inter', sans-serif; background: #fff; box-shadow: 0 10px 40px rgba(0,0,0,0.1); border: 1px solid #eee; cursor: grab; touch-action: pan-y;}
    .manset-container:active {cursor: grabbing;}
    .manset-wrapper {display: flex; height: 100%; width: 100%; position: absolute; top: 0; left: 0; transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); will-change: transform; pointer-events: auto;}
    .manset-link {text-decoration: none; color: inherit; display: block; flex: 0 0 100%; width: 100%; height: 100%; overflow: hidden; position: relative; user-select: none; -webkit-user-drag: none;}
    .manset-item {width: 100%; height: 100%; display: flex; position: relative;}
    .manset-image-side {width:50%; height: 100%; position: relative; overflow: hidden; flex-shrink: 0; pointer-events: none;}
    .manset-img {width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease;}
    .manset-link:hover .manset-img {transform: scale(1.05);}
    .manset-content-side {width:50%; height: 100%; background: #ffffff; padding:40px 5%; display: flex; flex-direction: column; justify-content: center; position: relative; flex-shrink: 0; overflow: hidden; pointer-events: none;}
    .manset-cats {font-size:12px; text-transform: uppercase; margin-bottom: 12px; display: block;}
    .manset-cats span:first-child{margin-right:8px; font-weight:600;}
    .manset-cats span:last-child{font-size:12px; font-weight:500; color:rgba(0,0,0,0.3);}
    .manset-title {font-size:32px; font-weight: 900; margin: 0 0 12px 0; line-height: 1.2; color: #1a1a1a; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; letter-spacing: -0.2px;}
    .manset-spot {font-size: 15px; line-height: 1.2; color:var(--text-muted); margin: 0 0 20px 0; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; overflow: hidden;}
    .manset-dots {position: absolute; bottom: 25px; left: 40px; display: flex; gap: 6px; z-index: 10;}
    .manset-dot {width: 8px; height: 8px; background:#ffffff; box-shadow: 0 0px 1px 0px rgba(0, 0, 0, .5); border-radius: 50%; cursor: pointer; transition: all 0.3s ease;}
    .manset-dot.active {width: 24px; background:var(--primary); border-radius: 4px;}
    .manset-nav {position: absolute; bottom: 20px; right: 40px; display: flex; gap: 10px; z-index: 10;}
    .manset-btn {background: #f8f8f8; border: 1px solid #eee; color: #333; width: 36px; height: 36px; border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.3s ease;}
    .manset-btn:hover {background:var(--primary); color: #fff; border-color:var(--primary);}
    @media (max-width: 1024px) {
        .manset-container {height: 480px !important; overflow: hidden;}
        .manset-wrapper {position: absolute; height: 100%; top: 0; left: 0;}
        .manset-link {flex: 0 0 100%; width: 100%; height: 100%;}
        .manset-item {flex-direction: column; height: 100%;}
        .manset-image-side {width: 100%; height: 220px; flex-shrink: 0;}
        .manset-content-side {width: 100%; padding: 20px; height: auto; flex-grow: 1; display: block;}
        .manset-title {font-size: 22px; margin-bottom: 8px; display: -webkit-box; white-space: normal;}
        .manset-spot {font-size: 14px; margin-bottom: 10px; -webkit-line-clamp: 2; display: -webkit-box;}
        .manset-dots {left: 20px; bottom: 15px;}
        .manset-nav {right: 20px; bottom: 10px;}
    }



/*Kutuphane*/    
.home-kutuphane {max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(5, 1fr); gap: 20px; align-items: stretch;}
.kutuphane-card {background: #ffffff; border: 1px solid #e0e0e0; padding: 40px 15px 25px 15px;text-align: center; position: relative; display: flex; flex-direction: column; justify-content: space-between; transition: transform 0.3s ease, box-shadow 0.3s ease; margin-top: 40px;}
.kutuphane-card:hover {box-shadow: 0 10px 20px rgba(0,0,0,0.05); transform: translateY(-5px);}
.avatar-wrapper {position: absolute; top: -40px; left: 50%; transform: translateX(-50%); width: 80px; height: 80px; border-radius: 50%; overflow: hidden; border: 4px solid #fff; box-shadow: 0 4px 10px rgba(0,0,0,0.1); background-color: #eee;}
.avatar-wrapper img {width: 100%; height: 100%; object-fit: cover;}
.author-name {font-weight: 700; font-size: 1.1rem; margin-bottom: 15px; color: #444; min-height: 2.4rem; display: flex; align-items: center; justify-content: center;}
.description {font-size: 0.75rem; line-height: 1.6; color:var(--text-muted); margin-bottom: 25px; flex-grow: 1; display: -webkit-box; -webkit-line-clamp:4; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}
.all-posts {font-size: 0.75rem; font-weight: 700; color: #888; text-decoration: none; text-transform: uppercase; letter-spacing: 1px; border-top: 1px solid #eee; padding-top: 15px; transition: color 0.2s;}
.all-posts:hover {color: #000;}
@media (max-width: 1024px) {
.home-kutuphane {
grid-template-columns: repeat(3, 1fr);
}
}
@media (max-width: 768px) {
.home-kutuphane {
grid-template-columns: repeat(2, 1fr);
gap: 40px 15px;
}
}
@media (max-width: 480px) {
.home-kutuphane {
grid-template-columns: 1fr;
padding: 0 10px;
}
}

/* Anasayfa ajax arama */
.search-area { position: relative; flex: 1; max-width: 400px; min-width: 250px; }
.search-input {width: 100%; background: #fff; border: 1px solid var(--border, #eee); border-radius: 0.75rem; padding: 0.6rem 1rem 0.6rem 2.5rem; font-size: 0.85rem; color: var(--text-main, #333); outline: none; transition: all 0.2s ease;}
.search-input:focus { border-color: var(--accent, #e21d24); box-shadow: 0 0 0 3px rgba(226, 29, 36, 0.05); }
.search-icon { position: absolute; left: 0.85rem; top: 50%; transform: translateY(-50%); color: var(--text-muted, #888); width: 1rem; pointer-events: none; }
.search-results {display: none; position: absolute; top: 115%; left: 0; right: 0; background: #fff; border: 1px solid var(--border, #eee); border-radius: 0.75rem; box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1); z-index: 2000; overflow: hidden;}
.searchlistesiactive{display:flex!important; flex-direction: column}
.search-item {display: flex; align-items: center; gap: 12px; padding: 0.75rem 1rem; text-decoration: none; color: var(--text-main, #333); border-bottom: 1px solid var(--border, #eee); transition: all 0.2s ease;}
.search-item:last-child { border-bottom: none; }
.search-item:hover { background: #fafafa; }
.search-item-title { font-size:0.79rem; font-weight: 300; margin: 0; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-results.active { display: block; }
/* Anasayfa dovizkurlari */
.top-info-bar { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
.info-pill { background: #fff; border: 1px solid var(--border); padding: 0.5rem 0.85rem; border-radius: 0.5rem; display: flex; align-items: center; gap: 0.5rem; font-weight: 600; font-size: 0.7rem; }

/*Haber Box*/
.news-box{width:100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; width: 100%; margin: 30px 0;}
.news-box li{display: flex; border-radius:12px; flex-direction:column; transition: var(--transition); padding: 1rem; border-radius: var(--radius-lg); margin:0px 0px; cursor: pointer; background-color: white; border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);}
.news-box li:Hover{transform: translateY(-5px); box-shadow: 0 15px 30px rgba(0, 0, 0, 0.08);}
.news-box figure{width: 100%; aspect-ratio: 10 / 7; overflow: hidden; border-radius: 20px; background-color: #f5f5f7;}
.news-box figure img {width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);}
.news-box:hover .news-box figure img {transform: scale(1.08);}
.news-box li h3{font-size: 18px; font-weight: 700; line-height: 1.3; transition: var(--transition); height:70px; margin:10px 0; color:var(--text-main); margin: 12px 4px; color: #1d1d1f; display: -webkit-box; -webkit-line-clamp:3; -webkit-box-orient: vertical; overflow: hidden;}
.news-box li:Hover h3{color:var(--text-muted);}
.news-box li a{color:var(--text-muted); text-decoration: none;}
.news-box li span{margin-right:8px;}
.news-box li .news-info{display: flex; justify-content:space-between; font-size:.75rem; line-height:20px; font-weight:300; margin:1rem 0; color:var(--text-muted-soft);}
.ncat {height: 20px; display: inline-flex; align-items: center; line-height: 1; text-transform: uppercase;}
.ncat span {width:20px; height:20px; margin-right:6px; display: flex; font-weight:800; align-items: center; justify-content: center; background: #000; color: #fff; border-radius: 4px; flex-shrink: 0;}
.load-button {grid-column: span 6; display: flex; flex-direction: column; align-items: center; padding: 40px 0;}
.btn-more {background: #1d1d1f;color: #fff;border: none; padding: 14px 32px; font-size: 15px; font-weight: 600; border-radius: 50px; cursor: pointer; transition: all 0.2s ease; display: flex; align-items: center; gap: 10px;}
.btn-more:hover { transform: scale(1.02); background: #000;}
.btn-more:disabled { opacity: 0.7; cursor: not-allowed;}
.loading-icon { display: none; width: 20px; height: 20px; border: 3px solid rgba(255,255,255,0.2); border-top-color: #fff; border-radius: 50%; animation: spin 0.8s linear infinite;}
@keyframes spin { to { transform: rotate(360deg); } }
.btn-more.loading .loading-icon { display: block; }
.action-btn { background: #f5f5f7; border: 1px solid #d2d2d7; padding: 6px 14px; border-radius: 12px; font-size: 13px; color: #1d1d1f; display: flex; align-items: center; gap: 5px; }
.time-text { font-size: 12px; color: #86868b; }
@media (max-width: 1024px) {
.news-box {grid-template-columns:repeat(3, 1fr); gap: 15px;}
}
@media (max-width:768px) {
.news-box {grid-template-columns:1fr; gap: 20px;}
}


/*Haberler*/
.haberler-box{width:100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; width: 100%; margin: 30px 0;}
.haberler-box li{display: flex; border-radius:12px; flex-direction:column; transition: var(--transition); border: 1px solid #dddd; padding: 1rem; border-radius: var(--radius-lg); margin:0px 0px; cursor: pointer; background-color: white;}
.haberler-box li:Hover{ transform: translateY(-2px); box-shadow: var(--shadow); }
.haberler-box li img { width:100%; aspect-ratio:10/6; object-fit: cover; border-radius:.5rem; flex-shrink: 0; }
.haberler-box li .haberdate{display: flex; justify-content:flex-start; font-size:11px; font-weight:300; margin:1rem 0; color:var(--text-muted-soft);}
.haberler-box li h3{font-size: 1.05rem; font-weight:600; transition: var(--transition); min-height:50px; margin:10px 0; color:var(--text-main);}
.haberler-box li:Hover h3{color:var(--text-muted);}
.haberler-box li a{color:var(--text-muted); text-decoration: none;}
.haberler-box li i{margin-right:8px;}
@media (max-width: 1024px) {
  .haberler-box {grid-template-columns: repeat(3, 1fr); /* 3 sütuna düşür */ gap: 15px;}
}
@media (max-width:768px) {
  .haberler-box {grid-template-columns: 1fr; /* Tek sütun */ gap: 20px;}
}


/*Haber Detay*/
.haberdetay {width:100%; color:var(--text-main); padding-bottom:80px;}
.breadcrumb {color:var(--text-muted); margin-bottom:30px; background-color:rgba(255,255,255,0.2); font-size:.75rem;}
.breadcrumb .sep { margin:0 8px; opacity:0.3; }
.breadcrumb a {color:inherit; text-decoration:none; transition:var(--transition); }
.breadcrumb a:hover { color:var(--primary); }
.haberdetay h3{ font-size:46px; font-weight:900; line-height:1.15; color:var(--text-main); margin-bottom:35px; letter-spacing:-1.2px; }
.haberdetay-info {width:100%; height: 60px; display: flex; justify-content: space-between; align-items: center; font-size:13px; font-weight:500; line-height:1.15; color:var(--text-muted); margin-bottom:35px;}
.sesli-dinle-container { margin: 20px 0; }
.btn-audio {display: flex; height:38px; line-height:26px; padding:6px 9px; background-color: #ffffff; color: #444444; border: 1px solid #d1d1d1; border-radius: 6px; font-size:14px; font-weight:500; text-decoration: none; transition: all 0.2s ease; cursor: pointer; outline: none;}
.btn-audio:hover { opacity: 0.9; }
#btnDinle i{background-color:#15b100; color:#fff; height:26px; width:26px; line-height:26px; border-radius:3px; margin-right:8px;}
#btnDurdur i{background-color:#d50000; color:#fff; height:26px; width:26px; line-height: 26px; border-radius:3px; margin-right:8px;}
.haberdetay figure {margin:0;}
.haberdetay figure img{width:100%; border-radius:var(--radius-xl); box-shadow:var(--shadow); }
.haberdetay-spot {width:90%; margin:2rem auto; padding-left:20px; border-left:4px solid var(--primary); box-sizing: border-box; font-size:26px; font-weight:700; line-height:1.4; color:var(--text-main);}
.haberdetay-body {width:90%; margin:0 auto; font-size:20px; line-height:1.8; color:var(--text-main); }
.haberdetay-body > p:first-of-type::first-letter {float:left; font-size:72px; line-height:60px; padding:4px 12px 0 3px; font-weight:900; color:var(--primary); }
.haberdetay ul {margin:1rem 0;}
.haberdetay li {padding-left:1rem;}
ul.haberdetay-gallery {margin:60px 0; padding:0px 1rem; display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:20px;}
ul.haberdetay-gallery li{ border-radius:8px; overflow:hidden; height:auto; }
ul.haberdetay-gallery li img {width:100%; aspect-ratio:10/6; object-fit:cover; transition:transform 0.6s ease; cursor:zoom-in; }
ul.haberdetay-gallery li img:hover { transform:scale(1.05); }
.haberdetay-tags {display:flex; flex-wrap:wrap; padding:0 1rem; gap:10px; margin-bottom:50px;}
.haberdetay-tags a { text-decoration:none; font-size:13px; font-weight:700; color:var(--text-muted); background:var(--border); padding:6px 16px; border-radius:50px; transition:var(--transition); }
.haberdetay-tags a:hover { background:var(--primary); color:#fff; }
.haberdetay-navigation {display:flex; padding:0 1rem; margin:2rem auto; justify-content: space-between; gap:10px;}
.haberdetay-navigation a {flex:1; border:1px solid #ebebeb; background-color:white; font-size:.96rem; color:var(--text-main); padding:16px; border-radius:1rem; display: flex; flex-direction: column;}
.haberdetay-navigation a:hover {background:#f4f4f4;}
.haberdetay-navigation a span:first-child{font-weight:600; margin-bottom: 8px; color:var(--primary);}

/* Lightbox Stilleri */
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,0.95); z-index:20000; display:none; align-items:center; justify-content:center; backdrop-filter:blur(8px); transition:var(--transition); }
.lightbox.active { display:flex; animation:fadeIn 0.3s ease; }
.lightbox-content { position:relative; display:flex; align-items:center; justify-content:center; max-width:90%; max-height:90%; }
.lightbox img { max-width:100%; max-height:85vh; border-radius:8px; box-shadow:0 0 50px rgba(0,0,0,0.5); transform:scale(0.9); transition:transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.lightbox.active img { transform:scale(1); }
.lightbox-close { position:absolute; top:30px; right:30px; color:#fff; font-size:40px; cursor:pointer; opacity:0.6; transition:0.2s; z-index:20001; }
.lightbox-close:hover { opacity:1; transform:scale(1.1); }
.lightbox-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.1); border:none; color:#fff; width:60px; height:60px; border-radius:50%; font-size:24px; cursor:pointer; transition:0.3s; display:flex; align-items:center; justify-content:center; z-index:20001; }
.lightbox-nav:hover { background:rgba(255,255,255,0.2); color:var(--primary); }
.lightbox-prev { left:30px; }
.lightbox-next { right:30px; }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

@media (max-width: 768px) { 
    .lightbox-nav { width:45px; height:45px; font-size:18px; }
    .lightbox-prev { left:10px; }
    .lightbox-next { right:10px; }
}



/*Pagination*/
.pagination {display: flex; justify-content: center; align-items: center; gap: 10px; padding: 10px 0;}
.page-numbers {display: inline-flex; align-items: center; justify-content: center; min-width: 42px; height: 42px; padding: 0 12px; text-decoration: none; font-size: 0.95rem; font-weight: 600; color: var(--text-main); background-color: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow); transition: var(--transition);}
.page-numbers:hover {color: var(--primary); border-color: var(--primary); transform: translateY(-2px);}
.page-numbers.current {background-color: var(--primary); border-color: var(--primary); color: #ffffff; cursor: default;}
.page-numbers i {font-size: 0.8rem; color: inherit;}
.page-numbers:active {border-color: var(--accent); color: var(--accent);}