*{margin:0;padding:0;box-sizing:border-box}body{font-family:Open Sans,sans-serif;line-height:1.6;color:#333;background-color:#f4f4f4}.container{max-width:1200px;margin:0 auto;padding:0 20px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}header{background-color:#fff;color:#2a2a2a;padding:1.25rem 0;box-shadow:0 2px 12px #00000014;position:sticky;top:0;z-index:100}nav .container{display:flex;justify-content:space-between;align-items:center}.logo{font-size:1.75rem;font-weight:700;color:#2a2a2a;letter-spacing:-.5px}.nav-links{display:flex;list-style:none;gap:2.5rem}.nav-links a{color:#5a6c7d;text-decoration:none;transition:all .3s ease;font-weight:500;font-size:.95rem;position:relative}.nav-links a:after{content:"";position:absolute;bottom:-5px;left:0;width:0;height:2px;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .3s ease}.nav-links a:hover:after,.nav-links a.active:after{width:100%}.nav-links a:hover,.nav-links a.active{color:#667eea}main{min-height:calc(100vh - 200px)}.hero{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:5rem 0;text-align:center;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;inset:0;background:url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse"><path d="M 100 0 L 0 0 0 100" fill="none" stroke="white" stroke-width="0.5" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');opacity:.3}.hero>.container{position:relative;z-index:1}.hero h2{font-size:3rem;margin-bottom:1rem;font-weight:700;letter-spacing:-1px}.hero p{font-size:1.3rem;margin-bottom:2.5rem;opacity:.95;font-weight:300}.btn{display:inline-block;padding:.85rem 2rem;text-decoration:none;border-radius:8px;transition:all .3s ease;border:none;cursor:pointer;font-size:1rem;font-weight:600;box-shadow:0 4px 6px #0000001a}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 12px #667eea66}.btn-secondary{background-color:#f8f9fa;color:#5a6c7d;border:2px solid #e9ecef}.btn-secondary:hover{background-color:#e9ecef;transform:translateY(-2px);box-shadow:0 6px 12px #0000001a}.featured,.topics{padding:4rem 0;background-color:#f8f9fa}.featured h3,.topics h3{font-size:2.25rem;margin-bottom:3rem;color:#2a2a2a;text-align:center;font-weight:700;position:relative;display:inline-block;left:50%;transform:translate(-50%)}.featured h3:after,.topics h3:after{content:"";position:absolute;bottom:-10px;left:50%;transform:translate(-50%);width:60px;height:4px;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:2px}.article-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;margin-top:2rem}.article-card{background:#fff;border-radius:12px;padding:2rem;box-shadow:0 2px 8px #00000014;transition:all .3s ease;border:1px solid #f0f0f0}.article-card:hover{transform:translateY(-8px);box-shadow:0 12px 24px #667eea26;border-color:#667eea}.article-card h4{color:#2a2a2a;margin-bottom:.5rem;font-size:1.3rem}.article-card h4 a{color:#2a2a2a;text-decoration:none;transition:color .3s}.article-card h4 a:hover{color:#3498db}.article-card .date{color:#7f8c8d;font-size:.9rem;margin-bottom:.5rem}.article-card .excerpt{color:#555;margin:1rem 0}.article-card .btn{margin-top:1rem}.article-card .tags,.article-item .tags,.article-meta .tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}.tag{background-color:#f0f3ff;color:#667eea;padding:.4rem 1rem;border-radius:20px;font-size:.85rem;cursor:pointer;transition:all .3s ease;font-weight:500;border:1px solid transparent}button.tag{font-family:inherit}.tag:hover{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;transform:translateY(-2px);box-shadow:0 4px 8px #667eea4d}.tag.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 8px #667eea4d}.tag-cloud{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.tag-cloud .tag{font-size:1rem}.about-section{padding:3rem 0;background-color:#fff}.about-section h2,.articles-section h2,.article-detail h2{font-size:2.5rem;margin-bottom:2rem;color:#2a2a2a}.about-content,.article-content{max-width:800px;margin:0 auto}.profile-section h3{color:#2a2a2a;font-size:1.8rem;margin-bottom:1rem}.profile-section h4{color:#34495e;font-size:1.3rem;margin-top:1.5rem;margin-bottom:.5rem}.profile-section p,.profile-section li,.article-item .summary{color:#555}.profile-section p,.article-content p{margin-bottom:1rem}.profile-section ul,.article-content ul,.article-content ol{margin-left:2rem;margin-bottom:1rem}.social-links{margin-top:2rem}.articles-section,.article-detail{padding:3rem 0}.search-filter-section{background:#fff;padding:2.5rem;border-radius:12px;margin-bottom:2rem;box-shadow:0 2px 8px #00000014;border:1px solid #f0f0f0}.search-box{display:flex;gap:1rem;margin-bottom:1.5rem}.search-box input{flex:1;padding:.85rem 1.25rem;border:2px solid #e9ecef;border-radius:8px;font-size:1rem;transition:all .3s ease}.search-box input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.show-more-btn{width:auto;padding:.4rem 1rem;background-color:transparent;color:#667eea;border:none;border-radius:6px;font-size:.85rem;font-weight:500;cursor:pointer;transition:all .3s ease}.show-more-btn:hover{background-color:#f0f3ff;text-decoration:underline}.search-filter-content{max-height:0;overflow:hidden;transition:max-height .3s ease}.search-filter-content.open{max-height:340px}.sort-section-outer{display:flex;align-items:center;gap:.75rem;margin-bottom:2rem}.sort-section-outer label,.filter-section h4{color:#5a6c7d;font-size:.9rem;font-weight:500}.sort-select{padding:.5rem 1rem;border:1px solid #e9ecef;border-radius:20px;font-size:.85rem;color:#667eea;background-color:#f0f3ff;cursor:pointer;transition:all .3s ease;font-family:Open Sans,sans-serif;font-weight:500}.sort-select:hover{border-color:#667eea;transform:translateY(-2px)}.filter-section{padding-top:1.5rem}.tag-filter{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}.articles-list{display:flex;flex-direction:column;gap:1.5rem}.article-item{background:#fff;padding:2.5rem;border-radius:12px;box-shadow:0 2px 8px #00000014;transition:all .3s ease;border-left:4px solid transparent}.article-item:hover{transform:translate(8px);box-shadow:0 8px 24px #667eea26;border-left-color:#667eea}.article-item h3{color:#2a2a2a;margin-bottom:.5rem;font-size:1.5rem}.article-item h3 a{color:#2a2a2a;text-decoration:none}.article-item h3 a:hover{color:#3498db}.article-item .date,.article-meta .date{color:#7f8c8d;font-size:.9rem;margin-bottom:1rem}.article-item .btn{margin-top:1rem}.no-results{text-align:center;padding:3rem;color:#7f8c8d;font-size:1.2rem}footer{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-align:center;padding:2.5rem 0;margin-top:4rem}.article-subtitle{font-size:1.2rem;color:#667eea;font-weight:400;font-style:italic;margin-bottom:1.5rem;line-height:1.6}.article-meta{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;padding-bottom:1rem;border-bottom:2px solid #ecf0f1;flex-wrap:wrap;gap:1rem}.article-content{line-height:1.8;color:#333}.article-content h3{color:#2a2a2a;font-size:1.8rem;margin-top:2rem;margin-bottom:1rem}.article-content a{color:#667eea}.article-footer{margin-top:3rem;padding-top:2rem;border-top:2px solid #ecf0f1;text-align:center}@media(max-width:768px){nav .container{flex-direction:column;gap:1rem}.nav-links{gap:1rem}.hero h2{font-size:1.8rem}.hero p{font-size:1rem}.article-grid{grid-template-columns:1fr}.search-box{flex-direction:column}.about-section h2,.articles-section h2,.article-detail h2{font-size:2rem}}@media(max-width:480px){.container{padding:0 15px}.logo{font-size:1.2rem}.nav-links{font-size:.9rem}.hero{padding:2rem 0}.hero h2{font-size:1.5rem}}
