.tech-blog-list-page{background-color:var(--base-100);min-height:100vh}.tech-blog-list-page .category-header{width:100vw;height:40svh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;text-align:center;padding:2rem}.tech-blog-list-page .category-header p{font-size:1.2rem;opacity:.7}.tech-blog-list-page .category-tabs-container{width:100%;overflow-x:auto;overflow-y:hidden;border-bottom:1px solid rgba(255,255,255,.1);margin-bottom:2rem;scrollbar-width:none;-ms-overflow-style:none}.tech-blog-list-page .category-tabs-container::-webkit-scrollbar{display:none}.tech-blog-list-page .category-tabs{display:flex;justify-content:center;gap:.5rem;padding:0 2rem;min-width:max-content}.tech-blog-list-page .category-tab{padding:1rem 1.5rem;font-size:1rem;font-weight:500;text-decoration:none;color:rgba(255,255,255,.6);border-bottom:3px solid transparent;transition:all .3s ease;white-space:nowrap;cursor:pointer;position:relative}.tech-blog-list-page .category-tab:hover{color:rgba(255,255,255,.9);background-color:rgba(255,255,255,.05)}.tech-blog-list-page .category-tab.active{color:rgba(255,255,255,1);border-bottom-color:rgba(255,255,255,.8);background-color:rgba(255,255,255,.08)}.tech-blog-list-page .category-tab.active:after{content:"";position:absolute;bottom:-1px;left:0;right:0;height:3px;background:linear-gradient(90deg,rgba(255,255,255,0),rgba(255,255,255,.8) 50%,rgba(255,255,255,0));animation:shimmer 2s ease-in-out infinite}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}.tech-blog-list-page .search-bar-container{width:85%;max-width:1400px;margin:0 auto;padding:0 2rem 2rem}.tech-blog-list-page .search-bar{position:relative;width:100%;max-width:600px;margin:0 auto}.tech-blog-list-page .search-input{width:100%;padding:1rem 1.5rem 1rem 3.5rem;font-size:1rem;border:2px solid rgba(255,255,255,.3);border-radius:12px;background-color:rgba(255,255,255,.05);color:inherit;outline:none;transition:all .3s ease}.tech-blog-list-page .search-input:focus{border-color:rgba(255,255,255,.8);background-color:rgba(255,255,255,.08);box-shadow:0 0 0 4px rgba(255,255,255,.15),0 4px 12px rgba(0,0,0,.2);transform:translateY(-1px)}.tech-blog-list-page .search-input::placeholder{color:rgba(255,255,255,.6);opacity:1}.tech-blog-list-page .search-icon{position:absolute;left:1.2rem;top:50%;transform:translateY(-50%);font-size:1.2rem;opacity:.7;pointer-events:none;transition:opacity .3s ease}.tech-blog-list-page .search-bar:focus-within .search-icon,.tech-blog-list-page .search-input:focus+.search-icon{opacity:1}.tech-blog-list-page .search-clear{position:absolute;right:1rem;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.1);border:none;font-size:1.2rem;cursor:pointer;opacity:.7;transition:all .2s ease;padding:.5rem;display:flex;align-items:center;justify-content:center;color:inherit;border-radius:6px}.tech-blog-list-page .search-clear:hover{opacity:1;background:rgba(255,255,255,.2);transform:translateY(-50%) scale(1.1)}.tech-blog-list-page .search-results-info{text-align:center;margin-top:1rem;opacity:.6;font-size:.95rem}.tech-blog-list-page .blog-posts-container{width:85%;max-width:1400px;margin:0 auto;padding:4rem 2rem 8rem}.tech-blog-list-page .blog-posts-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:3rem;gap:3rem;margin-top:2rem}.tech-blog-list-page .blog-post-card{position:relative;display:flex;flex-direction:column;gap:1.5rem;cursor:pointer;text-decoration:none;color:inherit;transition:transform .3s ease}.tech-blog-list-page .blog-post-card:hover{transform:translateY(-8px)}.tech-blog-list-page .blog-post-thumbnail{position:relative;width:100%;height:250px;overflow:hidden;border-radius:12px;background-color:var(--base-200)}.tech-blog-list-page .blog-post-thumbnail img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.tech-blog-list-page .blog-post-card:hover .blog-post-thumbnail img{transform:scale(1.05)}.tech-blog-list-page .blog-post-meta{display:flex;align-items:center;gap:1rem;font-size:.9rem;opacity:.6}.tech-blog-list-page .blog-post-date,.tech-blog-list-page .blog-post-read-time{display:flex;align-items:center;gap:.5rem}.tech-blog-list-page .blog-post-content{display:flex;flex-direction:column;gap:1rem}.tech-blog-list-page .blog-post-title{font-size:1.8rem;font-weight:600;line-height:1.3;margin:0;letter-spacing:.01em}.tech-blog-list-page .blog-post-excerpt{font-size:1rem;line-height:1.6;opacity:.8;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.tech-blog-list-page .blog-post-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}.tech-blog-list-page .blog-post-tag{padding:.4rem .8rem;background-color:var(--base-200);border-radius:6px;font-size:.85rem;opacity:.7}.tech-blog-list-page .no-posts{text-align:center;padding:4rem 2rem;opacity:.6}.tech-blog-list-page .no-posts h3{font-size:2rem;margin-bottom:1rem}.tech-blog-list-page .load-more-container{display:flex;justify-content:center;margin-top:4rem;padding:2rem 0}.tech-blog-list-page .load-more-btn{padding:1rem 3rem;font-size:1.1rem;font-weight:600;color:inherit;background-color:rgba(255,255,255,.1);border:2px solid rgba(255,255,255,.3);border-radius:12px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.tech-blog-list-page .load-more-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.tech-blog-list-page .load-more-btn:hover{background-color:rgba(255,255,255,.15);border-color:rgba(255,255,255,.6);transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.3)}.tech-blog-list-page .load-more-btn:hover:before{left:100%}.tech-blog-list-page .load-more-btn:active{transform:translateY(0)}@media (max-width:1000px){.tech-blog-list-page .category-header{height:30svh;padding:1.5rem}.tech-blog-list-page .category-tabs{justify-content:flex-start;padding:0 1rem}.tech-blog-list-page .category-tab{padding:.75rem 1rem;font-size:.9rem}.tech-blog-list-page .blog-posts-container{width:95%;padding:2rem 1rem 4rem}.tech-blog-list-page .blog-posts-grid{grid-template-columns:1fr;gap:2.5rem}.tech-blog-list-page .blog-post-thumbnail{height:200px}.tech-blog-list-page .blog-post-title{font-size:1.5rem;letter-spacing:.03em}}