/* PAGE HERO */
.page-hero{padding-top:40px; padding-bottom: 40px;position:relative;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(100px);pointer-events:none}
.blob-1{width:600px;height:600px;background:rgba(99,102,241,0.15);top:-200px;right:-150px}
.blob-2{width:400px;height:400px;background:rgba(6,182,212,0.1);bottom:-100px;left:-100px}
.page-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(99,102,241,0.12);border:1px solid rgba(99,102,241,0.3);color:var(--clr-primary-2);border-radius:50px;padding:6px 16px;font-size:0.82rem;font-weight:600;margin-bottom:1.2rem}
.page-title{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:900;color:var(--clr-text);letter-spacing:-0.5px;margin-bottom:0.8rem}
.page-title .gradient-text{background:linear-gradient(135deg,var(--clr-primary-2),var(--clr-accent));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.page-subtitle{color:var(--clr-muted);font-size:1rem;line-height:1.8;max-width:600px}
.breadcrumb-custom{display:flex;align-items:center;gap:8px;font-size:0.82rem;color:var(--clr-muted);margin-bottom:1rem;flex-wrap:wrap}
.breadcrumb-custom a{color:var(--clr-muted);text-decoration:none;transition:color 0.2s}
.breadcrumb-custom a:hover{color:var(--clr-primary-2)}
.breadcrumb-custom .sep{color:var(--clr-muted)}
.breadcrumb-custom .current{color:var(--clr-text)}
/* SEARCH BAR */
.search-wrap{position:relative;max-width:500px}
.search-input{background:var(--clr-card);border:1px solid var(--clr-border);border-radius:14px;color:var(--clr-text);font-family:'Cairo',sans-serif;font-size:0.9rem;padding:12px 48px 12px 16px;width:100%;transition:all 0.2s}
.search-input::placeholder{color:var(--clr-muted)}
.search-input:focus{background:rgba(99,102,241,0.06);border-color:rgba(99,102,241,0.4);color:var(--clr-text);box-shadow:0 0 0 3px rgba(99,102,241,0.1);outline:none}
.search-icon{position:absolute;top:50%;transform:translateY(-50%);right:16px;color:var(--clr-muted);pointer-events:none}
/* CATEGORIES */
.cat-btn{background:var(--primary-12);border:1px solid var(--clr-border);color:var(--clr-muted);border-radius:50px;font-size:0.8rem;font-weight:600;padding:6px 16px;cursor:pointer;transition:all 0.2s;font-family:'Cairo',sans-serif;white-space:nowrap}
.cat-btn:hover,.cat-btn.active{background:rgba(99,102,241,0.12);border-color:rgba(99,102,241,0.35);color:var(--clr-primary-2)}
/* FEATURED ARTICLE */
.featured-card{background:var(--clr-card);border:1px solid var(--clr-border);border-radius:24px;overflow:hidden;transition:all 0.3s;text-decoration:none;display:block}
.featured-card:hover{border-color:rgba(99,102,241,0.3);transform:translateY(-3px);box-shadow:0 20px 60px rgba(0,0,0,0.4)}
.featured-img{height:280px;background:linear-gradient(135deg,rgba(99,102,241,0.3),rgba(6,182,212,0.2));display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.featured-img .img-icon{font-size:5rem;opacity:0.3}
.featured-img .featured-badge{position:absolute;top:16px;right:16px;background:linear-gradient(135deg,var(--clr-primary),#4f46e5);color:#fff;font-size:0.72rem;font-weight:700;padding:5px 14px;border-radius:50px}
.featured-body{padding:28px}
.article-meta{display:flex;align-items:center;gap:16px;margin-bottom:12px;flex-wrap:wrap}
.article-cat{font-size:0.72rem;font-weight:700;padding:3px 10px;border-radius:6px}
.cat-ai{background:rgba(99,102,241,0.12);color:var(--clr-primary-2);border:1px solid rgba(99,102,241,0.2)}
.cat-org{background:rgba(6,182,212,0.12);color:var(--clr-accent);border:1px solid rgba(6,182,212,0.2)}
.cat-skills{background:rgba(16,185,129,0.12);color:#34d399;border:1px solid rgba(16,185,129,0.2)}
.cat-research{background:rgba(245,158,11,0.12);color:#fbbf24;border:1px solid rgba(245,158,11,0.2)}
.cat-tools{background:rgba(168,85,247,0.12);color:#c084fc;border:1px solid rgba(168,85,247,0.2)}
.article-date{font-size:0.78rem;color:var(--clr-muted);display:flex;align-items:center;gap:5px}
.article-read{font-size:0.78rem;color:var(--clr-muted);display:flex;align-items:center;gap:5px}
.featured-title{font-size:1.4rem;font-weight:800;color:var(--clr-text);line-height:1.4;margin-bottom:10px}
.featured-excerpt{font-size:0.9rem;color:var(--clr-muted);line-height:1.7;margin-bottom:16px}
.author-mini{display:flex;align-items:center;gap:10px}
.author-avatar{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.8rem;font-weight:700;color:#fff;flex-shrink:0}
.author-name{font-size:0.82rem;font-weight:600;color:var(--clr-muted)}
.read-more-link{font-size:0.82rem;color:var(--clr-primary-2);font-weight:600;display:flex;align-items:center;gap:5px;text-decoration:none;transition:gap 0.2s}
.read-more-link:hover{gap:8px;color:#a5b4fc}
/* ARTICLE CARDS */
.article-card{background:var(--clr-card);border:1px solid var(--clr-border);border-radius:20px;overflow:hidden;transition:all 0.3s;text-decoration:none;display:flex;flex-direction:column;height:100%}
.article-card:hover{border-color:rgba(99,102,241,0.25);transform:translateY(-3px);box-shadow:0 16px 50px rgba(0,0,0,0.35)}
.article-img{height:180px;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}
.article-img .img-icon{font-size:3.5rem;opacity:0.35}
.article-body{padding:22px;flex:1;display:flex;flex-direction:column}
.article-title{font-size:1rem;font-weight:800;color:var(--clr-text);line-height:1.5;margin-bottom:8px;flex:1}
.article-excerpt{font-size:0.82rem;color:var(--clr-muted);line-height:1.7;margin-bottom:14px}
.article-footer{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--clr-border);margin-top:auto}
/* SIDEBAR */
.sidebar-card{background:var(--clr-card);border:1px solid var(--clr-border);border-radius:20px;padding:24px;margin-bottom:20px}
.sidebar-title{font-size:0.85rem;font-weight:800;color:var(--clr-text);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.sidebar-title i{color:var(--clr-primary-2)}
.trending-item{display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--clr-border)}
.trending-item:last-child{border-bottom:none;padding-bottom:0}
.trending-num{font-size:1.2rem;font-weight:900;color:rgba(99,102,241,0.3);min-width:28px;line-height:1}
.trending-title{font-size:0.82rem;font-weight:600;color:var(--clr-text);line-height:1.5;text-decoration:none;transition:color 0.2s;display:block}
.trending-title:hover{color:var(--clr-primary-2)}
.trending-meta{font-size:0.72rem;color:var(--clr-muted);margin-top:3px}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px}
.tag-item{background:var(--primary-12);border:1px solid var(--clr-border);color:var(--clr-muted);border-radius:8px;font-size:0.78rem;font-weight:500;padding:5px 12px;text-decoration:none;transition:all 0.2s}
.tag-item:hover{background:rgba(99,102,241,0.1);border-color:rgba(99,102,241,0.3);color:var(--clr-primary-2)}
.newsletter-card{background:linear-gradient(135deg,rgba(99,102,241,0.12),rgba(6,182,212,0.08));border:1px solid rgba(99,102,241,0.2);border-radius:20px;padding:24px;text-align:center}
.newsletter-card h5{font-size:1rem;font-weight:800;color:var(--clr-text);margin-bottom:6px}
.newsletter-card p{font-size:0.82rem;color:var(--clr-muted);margin-bottom:16px;line-height:1.6}
.newsletter-input{background:var(--clr-card);border:1px solid var(--clr-border);border-radius:10px;color:var(--clr-text);font-family:'Cairo',sans-serif;font-size:0.82rem;padding:10px 14px;width:100%;margin-bottom:10px}
.newsletter-input::placeholder{color:var(--clr-muted)}
.newsletter-input:focus{background:rgba(99,102,241,0.06);border-color:rgba(99,102,241,0.4);outline:none}
.btn-newsletter{background:linear-gradient(135deg,var(--clr-primary),#4f46e5);border:none;color:#fff;border-radius:10px;font-weight:700;font-size:0.85rem;padding:10px;width:100%;font-family:'Cairo',sans-serif;cursor:pointer;transition:all 0.2s}
.btn-newsletter:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(99,102,241,0.4)}

/* ── Light Mode Overrides ── */
html[data-theme="light"] .featured-card { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
html[data-theme="light"] .featured-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
html[data-theme="light"] .article-card { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
html[data-theme="light"] .article-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.1); }
html[data-theme="light"] .sidebar-card { box-shadow: 0 2px 12px rgba(0,0,0,0.06); }
html[data-theme="light"] .newsletter-card { background: linear-gradient(135deg, rgba(99,102,241,0.06), rgba(6,182,212,0.04)); }
html[data-theme="light"] .search-input { box-shadow: 0 1px 4px rgba(0,0,0,0.04); }
html[data-theme="light"] .read-more-link:hover { color: var(--clr-primary); }