/* This CSS code is developed for the @KDR Team and Khogendra Rupini. 
It is exclusively owned and maintained by him.
If anyone wishes to use this stylesheet, they must first contact Khogendra Rupini 
through his official website https://khogendrarupini.com 
Or his GitHub profile https://github.com/khogendrarupini/
This code is protected and requires a valid license, 
as it falls under the @KDR License by Khogendra Rupini. */

* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Inter', sans-serif; background: #13171a; color: #e8edf2; line-height: 1.5; min-height: 100vh; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.page-heading { padding: 48px 0 24px 0; margin-bottom: 32px; border-bottom: 1px solid #2a2f33; }
.page-heading h1 { font-size: 1.8rem; font-weight: 400; letter-spacing: -0.02em; line-height: 1.2; color: #ffffff; margin-bottom: 8px; }
.page-heading h1 span { color: #05ff97; border-bottom: 2px solid #05ff97; }
.page-heading p { font-size: 1rem; color: #9aaebf; margin-top: 8px; }
.rss-link { margin-top: 12px; display: inline-flex; align-items: center; gap: 8px; background: #0f1316; padding: 8px 16px; border: 1px solid #2a3135; font-size: 0.8rem; color: #05ff97; text-decoration: none; }
.rss-link:hover { background: #1a2125; }
.controls-panel { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 48px; background: #0f1316; padding: 16px 24px; border: 1px solid #252b2f; }
.search-wrapper { display: flex; align-items: center; background: #0b0f11; padding: 8px 18px; gap: 12px; flex: 1; min-width: 240px; border: 1px solid #2a3135; }
.search-wrapper input { border: none; background: transparent; font-size: 0.9rem; padding: 10px 0; width: 100%; outline: none; color: #e8edf2; }
.filter-group { display: flex; gap: 8px; flex-wrap: wrap; }
.filter-chip { background: #0f1316; border: 1px solid #2a3135; padding: 8px 20px; font-weight: 600; font-size: 0.8rem; cursor: pointer; color: #b7cddf; display: flex; align-items: center; gap: 8px; }
.filter-chip.active { background: #2c3e44; border-color: #6c9ebf; color: white; }
.updates-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 28px; margin-bottom: 64px; }
.news-card { background: #0f1316; border: 1px solid #252c30; transition: all 0.2s ease; display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.news-card:hover { border-color: #4a6f86; background: #11171b }
.card-image { width: 100%; height: 200px; object-fit: cover; display: block; background: #0a0e10; border-bottom: 1px solid #1e262a; }
.card-header { padding: 20px 24px 8px 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; border-bottom: 1px solid #1e262a; }
.tag { font-size: 0.7rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.4px; padding: 4px 12px; display: inline-flex; align-items: center; gap: 6px; }
.tag.update { background: #1a2a24; color: #8fcfb0; border: 1px solid #2d4a3e; }
.tag.announcement { background: #2a2220; color: #e6b8a2; border: 1px solid #4a332c; }
.tag.feature { background: #1f2937; color: #9bb8e0; border: 1px solid #2e415a; }
.date-chip { font-size: 0.7rem; color: #7c92a3; display: flex; align-items: center; gap: 6px; }
.card-body { padding: 20px 24px 24px 24px; flex: 1; }
.card-body h3 { font-size: 1.35rem; font-weight: 700; margin: 0 0 12px 0; line-height: 1.4; color: #ffffff; }
.excerpt { color: #a5bbc9; font-size: 0.9rem; margin-bottom: 24px; line-height: 1.55; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.read-more { background: transparent; border: 1px solid #3a4a55; color: #b7d0e5; font-weight: 600; font-size: 0.8rem; display: inline-flex; align-items: center; gap: 8px; cursor: pointer; padding: 8px 18px; font-family: inherit; }
.read-more:hover { background: #1e2a30; border-color: #6c9ebf; color: white}
.empty-state { text-align: center; padding: 80px 32px; background: #0f1316; border: 1px solid #252c30; grid-column: 1 / -1; }
.footer-note { text-align: center; border-top: 1px solid #1e262a; padding: 36px 0 32px; margin-top: 20px; color: #70879b; font-size: 0.8rem; }
@media (max-width: 768px) { .container { padding: 0 20px; } .updates-grid { grid-template-columns: 1fr; } .card-image { height: 160px; } }