/* ErtanHub - Modern Dark Theme */
:root {
  --bg: #07070a;
  --bg-card: #12121a;
  --bg-card-hover: #1a1a26;
  --text: #f0f0f5;
  --text-muted: #9a9ab0;
  --accent: #8b5cf6;
  --accent-2: #ec4899;
  --gradient: linear-gradient(135deg, #8b5cf6 0%, #ec4899 50%, #3b82f6 100%);
  --border: #252532;
  --radius: 12px;
  --shadow: 0 4px 24px rgba(0,0,0,.4);
  --header-h: 64px;
  --font: 'Inter', system-ui, sans-serif;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent);text-decoration:none}
a:hover{color:var(--accent-2)}
.container{width:100%;max-width:1280px;margin:0 auto;padding:0 1rem}

/* Header */
.site-header{background:var(--bg-card);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100}
.header-inner{display:flex;align-items:center;gap:1rem;padding:.75rem 0;min-height:var(--header-h)}
.logo-text{font-size:1.5rem;font-weight:700;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.search-form{flex:1;max-width:400px;display:flex;margin:0 auto}
.search-form input{flex:1;padding:.6rem 1rem;border:1px solid var(--border);border-radius:var(--radius) 0 0 var(--radius);background:var(--bg);color:var(--text)}
.search-form button{padding:.6rem 1rem;border:1px solid var(--border);border-left:0;border-radius:0 var(--radius) var(--radius) 0;background:var(--bg-card-hover);color:var(--text);cursor:pointer}
.main-nav{display:flex;gap:1rem}
.main-nav a{color:var(--text-muted);font-weight:500}
.main-nav a:hover{color:var(--text)}
.nav-toggle{display:none;background:none;border:none;color:var(--text);font-size:1.5rem;cursor:pointer}
.category-nav{overflow-x:auto;border-top:1px solid var(--border);padding:.5rem 0}
.category-nav .container{display:flex;gap:.75rem;white-space:nowrap}
.category-nav a{padding:.35rem .85rem;border-radius:999px;background:var(--bg);color:var(--text-muted);font-size:.875rem}
.category-nav a:hover{background:var(--accent);color:#fff}

/* Main */
.site-main{padding:1.5rem 0 3rem;min-height:60vh}
.section{margin-bottom:2.5rem}
.section-title{font-size:1.5rem;margin-bottom:1rem;display:flex;align-items:center;justify-content:space-between}
.section-title a{font-size:.875rem;color:var(--text-muted)}

/* Slider */
.hero-slider{position:relative;border-radius:var(--radius);overflow:hidden;margin-bottom:2rem;aspect-ratio:21/9;min-height:280px}
.slide{position:absolute;inset:0;opacity:0;transition:opacity .5s}
.slide.active{opacity:1;position:relative}
.slide img{width:100%;height:100%;object-fit:cover}
.slide-overlay{position:absolute;inset:0;background:linear-gradient(transparent 40%,rgba(0,0,0,.85));display:flex;flex-direction:column;justify-content:flex-end;padding:2rem}
.slide-overlay h2{font-size:clamp(1.25rem,3vw,2rem);margin-bottom:.5rem}
.slide-overlay p{color:var(--text-muted);max-width:600px}

/* Grid */
.content-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1.25rem}
.content-card{background:var(--bg-card);border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);transition:transform .2s,box-shadow .2s}
.content-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:var(--accent)}
.card-link{color:inherit;display:block}
.card-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:#000}
.card-thumb img{width:100%;height:100%;object-fit:cover}
.card-badge{position:absolute;top:.5rem;left:.5rem;background:var(--gradient);padding:.2rem .6rem;border-radius:4px;font-size:.75rem;font-weight:600}
.card-views{position:absolute;bottom:.5rem;right:.5rem;background:rgba(0,0,0,.7);padding:.2rem .5rem;border-radius:4px;font-size:.7rem}
.card-body{padding:1rem}
.card-category{font-size:.75rem;color:var(--accent);text-transform:uppercase;letter-spacing:.05em}
.card-title{font-size:1rem;margin:.35rem 0;font-weight:600;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card-desc{font-size:.85rem;color:var(--text-muted);margin-bottom:.5rem}

/* Content detail */
.content-detail{max-width:900px;margin:0 auto}
.breadcrumb{font-size:.875rem;color:var(--text-muted);margin-bottom:1rem}
.breadcrumb a{color:var(--text-muted)}
.content-detail h1{font-size:clamp(1.5rem,4vw,2rem);margin-bottom:1rem}
.meta-bar{display:flex;flex-wrap:wrap;gap:1rem;color:var(--text-muted);font-size:.875rem;margin-bottom:1.5rem}
.player-wrap{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:var(--radius);overflow:hidden;margin-bottom:1.5rem}
.player-wrap iframe,.player-wrap video{position:absolute;inset:0;width:100%;height:100%;border:0}
.responsive-iframe{position:relative;padding-bottom:56.25%;height:0;overflow:hidden}
.responsive-iframe iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0}
.content-description{margin:1.5rem 0;line-height:1.8}
.tag-list{display:flex;flex-wrap:wrap;gap:.5rem;margin:1rem 0}
.tag-list a{padding:.35rem .75rem;background:var(--bg-card);border-radius:999px;font-size:.85rem;border:1px solid var(--border)}
.share-buttons{display:flex;gap:.5rem;margin:1.5rem 0}
.share-buttons a{padding:.5rem 1rem;background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);color:var(--text);font-size:.875rem}
.adjacent-nav{display:flex;justify-content:space-between;gap:1rem;margin-top:2rem;padding-top:1.5rem;border-top:1px solid var(--border)}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem}
.gallery-item{cursor:pointer;border-radius:var(--radius);overflow:hidden;aspect-ratio:4/3}
.gallery-item img{width:100%;height:100%;object-fit:cover}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:1000;display:none;align-items:center;justify-content:center;padding:1rem}
.lightbox.active{display:flex}
.lightbox img{max-height:90vh;max-width:90vw;object-fit:contain}
.lightbox-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#fff;font-size:2rem;cursor:pointer}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:.65rem 1.25rem;border-radius:var(--radius);font-weight:600;font-size:.9rem;cursor:pointer;border:none;transition:opacity .2s}
.btn-primary{background:var(--gradient);color:#fff}
.btn-outline{background:transparent;border:1px solid var(--border);color:var(--text)}

/* Pagination */
.pagination{display:flex;gap:.5rem;justify-content:center;margin-top:2rem;list-style:none}
.pagination .page-link{padding:.5rem .85rem;border-radius:var(--radius);background:var(--bg-card);border:1px solid var(--border);color:var(--text)}
.pagination .active .page-link{background:var(--accent);border-color:var(--accent)}

/* Footer */
.site-footer{background:var(--bg-card);border-top:1px solid var(--border);padding:2.5rem 0 1rem;margin-top:3rem}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem;margin-bottom:2rem}
.footer-col h3,.footer-col h4{margin-bottom:.75rem;font-size:1rem}
.footer-col ul{list-style:none}
.footer-col li{margin-bottom:.35rem}
.footer-col a{color:var(--text-muted)}
.footer-bottom{text-align:center;padding-top:1rem;border-top:1px solid var(--border);color:var(--text-muted);font-size:.875rem}

/* Age gate */
.age-gate{position:fixed;inset:0;background:rgba(0,0,0,.95);z-index:9999;display:flex;align-items:center;justify-content:center}
.age-gate-box{text-align:center;max-width:400px;padding:2rem;background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border)}
.age-gate-box h2{margin-bottom:1rem}
.age-gate-box .btn{margin:.5rem}

/* SEO text block */
.seo-block{background:var(--bg-card);padding:1.5rem;border-radius:var(--radius);border:1px solid var(--border);color:var(--text-muted);font-size:.9rem}

/* 404 */
.error-page{text-align:center;padding:4rem 1rem}
.error-page h1{font-size:4rem;background:var(--gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* Ad zones */
.ad-zone{margin:1rem 0;text-align:center;min-height:50px}

/* Mobile */
@media(max-width:768px){
  .nav-toggle{display:block}
  .main-nav{display:none;position:absolute;top:100%;left:0;right:0;background:var(--bg-card);flex-direction:column;padding:1rem;border-bottom:1px solid var(--border)}
  .main-nav.open{display:flex}
  .search-form{order:3;width:100%;max-width:none;margin-top:.5rem}
  .header-inner{flex-wrap:wrap}
  .hero-slider{aspect-ratio:16/9;min-height:200px}
}

/* CLS prevention */
.card-thumb,.player-wrap{background:#0a0a0f}