.blog-page{background:linear-gradient(135deg,#f9fafb 0%,#f3f4f6 100%);min-height:100vh;position:relative}.blog-page:before{content:"";z-index:10;background:linear-gradient(90deg,#0000,#e5e7eb,#0000);height:1px;position:fixed;top:0;left:0;right:0}.blog-banner{color:#fff;text-align:center;background:linear-gradient(135deg,#0070f3 0%,#9333ea 100%);padding:6rem 1rem 5rem;position:relative;overflow:hidden}.blog-banner:before{content:"";opacity:.3;background:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><defs><pattern id=\"grid\" width=\"10\" height=\"10\" patternUnits=\"userSpaceOnUse\"><path d=\"M 10 0 L 0 0 0 10\" fill=\"none\" stroke=\"rgba(255,255,255,0.05)\" stroke-width=\"0.5\"/></pattern></defs><rect width=\"100\" height=\"100\" fill=\"url(%23grid)\"/></svg>");position:absolute;inset:0}.blog-banner .banner-content{z-index:1;max-width:1600px;margin:0 auto;position:relative}.blog-banner .banner-content h1{letter-spacing:-.025em;text-shadow:0 2px 4px #0000001a;margin-bottom:1rem;font-size:2.25rem;font-weight:800}@media (min-width:768px){.blog-banner .banner-content h1{font-size:4rem}}.blog-banner .banner-content p{color:#fffffff2;max-width:4xl;letter-spacing:.01em;margin:0 auto;font-size:1.25rem;font-weight:300}.categories-filter{z-index:2;background-color:#fff;border-radius:.75rem;max-width:1600px;margin:0 auto;padding:2rem 1rem;position:relative;top:-3rem;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.categories-filter h2{color:#1f2937;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:1.25rem;font-weight:700;display:flex}.categories-filter h2:before{content:"";background:linear-gradient(135deg,#0070f3,#9333ea);border-radius:9999px;width:4px;height:24px}.categories-filter .categories-list{flex-wrap:wrap;gap:.75rem;display:flex}.categories-filter .category-item{color:#374151;white-space:nowrap;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:9999px;padding:.75rem 1.5rem;font-size:.875rem;font-weight:500;transition:all .15s ease-in-out;position:relative;overflow:hidden}.categories-filter .category-item:hover{color:#111827;background-color:#f3f4f6;border-color:#d1d5db;transform:translateY(-1px);box-shadow:0 4px 12px #0000000d}.categories-filter .category-item.active{color:#fff;background:linear-gradient(135deg,#0070f3 0%,#9333ea 100%);border-color:#0000;box-shadow:0 4px 16px #0070f34d}.categories-filter .category-item.active:hover{background:linear-gradient(135deg,#0058c0 0%,#7a16d4 100%);transform:translateY(-1px);box-shadow:0 6px 20px #0070f366}.articles-container{max-width:1600px;margin:0 auto;padding:2rem 1rem}.articles-list{grid-template-columns:1fr;gap:2rem;display:grid}@media (min-width:1024px){.articles-list{grid-template-columns:repeat(auto-fill,minmax(380px,1fr))}}.article-item{background-color:#fff;border:1px solid #f3f4f6;border-radius:.75rem;transition:all .2s ease-in-out;overflow:hidden;box-shadow:0 4px 20px #0000000d}.article-item:hover{border-color:#e5e7eb;transform:translateY(-4px);box-shadow:0 20px 40px #0000001a}.article-item .card-content{padding:2rem}.article-item .card-meta{color:#6b7280;text-transform:uppercase;letter-spacing:.05em;align-items:center;gap:1rem;margin-bottom:1rem;font-size:.75rem;font-weight:500;display:flex}.article-item .card-meta .meta-item{align-items:center;gap:.25rem;display:flex}.article-item .card-meta .meta-item:first-child:before{content:"";background-color:#0070f3;border-radius:9999px;width:2px;height:12px}.article-item .card-title{color:#111827;margin-bottom:1rem;font-size:1.25rem;font-weight:700;line-height:1.4;transition:color .15s ease-in-out}.article-item .card-title:hover{color:#0070f3}.article-item .card-excerpt{color:#4b5563;-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-bottom:1.5rem;font-size:.875rem;line-height:1.7;display:-webkit-box;overflow:hidden}.article-item .card-footer{border-top:1px solid #f3f4f6;justify-content:space-between;align-items:center;padding-top:1.5rem;display:flex}.article-item .card-author{color:#374151;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;display:flex}.article-item .card-author:before{display:none}.article-item .card-link{color:#0070f3;align-items:center;gap:.25rem;font-size:.875rem;font-weight:600;text-decoration:none;transition:all .15s ease-in-out;display:flex}.article-item .card-link:hover{color:#0058c0;gap:.5rem}.article-item .card-link:after{content:"→";transition:transform .15s ease-in-out}.article-item .card-link:hover:after{transform:translate(3px)}.loading{color:#6b7280;justify-content:center;align-items:center;gap:.75rem;min-height:300px;font-size:1.25rem;display:flex}.loading:after{content:"";border:3px solid #e5e7eb;border-top-color:#0070f3;border-radius:9999px;width:24px;height:24px;animation:1s linear infinite spin}.no-articles{text-align:center;color:#6b7280;padding:6rem}.no-articles h3{color:#374151;margin-bottom:.5rem;font-size:1.5rem;font-weight:600}.no-articles p{font-size:1.125rem}.pagination{justify-content:center;margin-top:4rem;padding:2rem 0;display:flex}.pagination-wrapper{background-color:#fff;border:1px solid #f3f4f6;border-radius:.5rem;align-items:center;gap:.5rem;padding:.5rem;display:inline-flex;box-shadow:0 4px 20px #0000000d}.pagination-btn,.pagination-page{color:#4b5563;cursor:pointer;background-color:#0000;border:none;border-radius:.375rem;justify-content:center;align-items:center;min-width:40px;height:40px;font-size:.875rem;font-weight:500;transition:all .15s ease-in-out;display:flex}.pagination-btn{padding:0 1rem}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-btn:disabled:hover{color:#9ca3af;background-color:#0000}.pagination-btn:not(:disabled):hover{color:#fff;background-color:#0070f3}.pagination-page.active{color:#fff;background-color:#0070f3;font-weight:600}.pagination-page:not(.active):hover{color:#111827;background-color:#f3f4f6}@media (prefers-color-scheme:dark){.blog-page{background:#1e293b}.blog-banner{background:linear-gradient(135deg,#004da7 0%,#6c13bd 100%)}.blog-banner:before{background:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 100 100\"><defs><pattern id=\"grid\" width=\"10\" height=\"10\" patternUnits=\"userSpaceOnUse\"><path d=\"M 10 0 L 0 0 0 10\" fill=\"none\" stroke=\"rgba(255,255,255,0.03)\" stroke-width=\"0.5\"/></pattern></defs><rect width=\"100\" height=\"100\" fill=\"url(%23grid)\"/></svg>")}.categories-filter{background-color:#1e293b;border-color:#334155;box-shadow:0 10px 30px #0000004d}.categories-filter h2{color:#f8fafc}.categories-filter h2:before{background:linear-gradient(135deg,#0070f3,#9333ea)}.categories-filter .category-item{color:#94a3b8;background-color:#0f172a;border-color:#334155}.categories-filter .category-item:hover{color:#f8fafc;background-color:#151d2a;border-color:#475569}.categories-filter .category-item.active{color:#fff;background:linear-gradient(135deg,#0070f3 0%,#9333ea 100%)}.article-item{background-color:#1e293b;border-color:#334155;box-shadow:0 4px 20px #0000004d}.article-item:hover{border-color:#475569;box-shadow:0 10px 30px #0006}.article-item .card-meta{color:#94a3b8}.article-item .card-meta .meta-item:first-child:before{background-color:#0070f3}.article-item .card-title{color:#f8fafc}.article-item .card-title:hover{color:#0070f3}.article-item .card-excerpt{color:#94a3b8}.article-item .card-footer{border-top-color:#334155}.article-item .card-author{color:#f8fafc}.article-item .card-author:before{background:linear-gradient(135deg,#0070f3,#9333ea)}.article-item .card-link{color:#0070f3}.article-item .card-link:hover{color:#278bff}.loading{color:#94a3b8}.loading:after{border-color:#0070f3 #334155 #334155}.no-articles{color:#94a3b8}.no-articles h3{color:#f8fafc}.pagination-wrapper{background-color:#1e293b;border-color:#334155;box-shadow:0 4px 20px #0000004d}.pagination-btn,.pagination-page{color:#94a3b8}.pagination-btn:hover:not(.active):not(:disabled),.pagination-page:hover:not(.active):not(:disabled){color:#f8fafc;background-color:#0f172a}.pagination-btn.active,.pagination-page.active{color:#fff;background-color:#0070f3}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:1024px){.blog-banner{padding:4rem 1rem}.categories-filter{padding:1.5rem 1rem;top:-3rem}.articles-list{gap:1.5rem}.article-item .card-content{padding:1.5rem}}@media (max-width:640px){.blog-banner h1{font-size:1.875rem}.blog-banner p{font-size:1rem}.categories-filter{padding:1rem;top:-2.5rem}.categories-list{gap:.5rem}.category-item{padding:.5rem 1rem;font-size:.75rem}.articles-container{padding:1rem}.article-item .card-title{font-size:1.125rem}.article-item .card-footer{flex-direction:column;align-items:flex-start;gap:.75rem}.pagination-wrapper{justify-content:center;width:100%;overflow-x:auto}}