#blog{background:linear-gradient(90deg,#0362c2,#012c5c);justify-content:center;align-items:center;max-width:100%;min-height:40vh;padding-top:2.5rem;display:flex}#blog .text-box{text-align:center;max-width:50%}#blog .text-box h1{color:#fff;font-size:45px;line-height:1.5}#blog .text-box p{color:#979dac;font-size:20px}#blog-section{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);width:100%;padding:60px 20px;position:relative}#blog-section:before{content:"";pointer-events:none;background:radial-gradient(circle at 20%,#0066cc0d 0%,#0000 50%),radial-gradient(circle at 80% 80%,#00a8ff0d 0%,#0000 50%);position:absolute;inset:0}#blog-section .container{z-index:1;max-width:1400px;margin:0 auto;position:relative}#blog-section .category-filters{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-bottom:50px;display:flex}#blog-section .category-filters .filter-btn{color:#555;cursor:pointer;background:linear-gradient(135deg,#fff 0%,#f8f9fa 100%);border:2px solid #0000;border-radius:30px;padding:12px 28px;font-size:15px;font-weight:600;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 3px 10px #00000014}#blog-section .category-filters .filter-btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff80,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}#blog-section .category-filters .filter-btn:hover{background:linear-gradient(135deg,#f0f0f0 0%,#e8e9ea 100%);border-color:#06c;transform:translateY(-3px)scale(1.02);box-shadow:0 6px 20px #0000001f}#blog-section .category-filters .filter-btn:hover:before{left:100%}#blog-section .category-filters .filter-btn.active{color:#fff;background:linear-gradient(135deg,#06c 0%,#0052a3 100%);border-color:#06c;transform:translateY(-2px);box-shadow:0 6px 24px #06c6}#blog-section .blog-grid{grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:30px;display:grid}@media (max-width:1200px){#blog-section .blog-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))}}@media (max-width:768px){#blog-section .blog-grid{grid-template-columns:1fr}}#blog-section .blog-card{background:#fff;border:1px solid #0000000a;border-radius:16px;flex-direction:column;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden;box-shadow:0 8px 24px #0000000f}#blog-section .blog-card:before{content:"";opacity:0;background:linear-gradient(90deg,#06c,#00a8ff,#06c) 0 0/200% 100%;height:3px;transition:opacity .4s;position:absolute;top:0;left:0;right:0}#blog-section .blog-card:hover{border-color:#06c3;transform:translateY(-12px)scale(1.02);box-shadow:0 20px 40px #0066cc26}#blog-section .blog-card:hover:before{opacity:1;animation:2s infinite shimmer}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}#blog-section .blog-card .blog-image{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);width:100%;height:200px;position:relative;overflow:hidden}#blog-section .blog-card .blog-image:after{content:"";z-index:1;background:linear-gradient(#0000 0%,#0000004d 100%);position:absolute;inset:0}#blog-section .blog-card .blog-image img{object-fit:cover;filter:brightness(.95);width:100%;height:100%;transition:all .6s cubic-bezier(.4,0,.2,1)}#blog-section .blog-card .blog-image .category-badge{color:#fff;z-index:2;letter-spacing:.5px;text-transform:uppercase;background:linear-gradient(135deg,#06c 0%,#0052a3 100%);border-radius:25px;padding:8px 18px;font-size:12px;font-weight:700;position:absolute;top:16px;left:16px;box-shadow:0 4px 12px #0066cc4d}#blog-section .blog-card .blog-image:hover img{filter:brightness(1.05);transform:scale(1.1)rotate(1deg)}#blog-section .blog-card .blog-content{background:linear-gradient(#fff 0%,#fafbfc 100%);flex-direction:column;flex-grow:1;padding:22px;display:flex}#blog-section .blog-card .blog-content .blog-meta{color:#888;align-items:center;gap:10px;margin-bottom:14px;font-size:13px;font-weight:600;display:flex}#blog-section .blog-card .blog-content .blog-meta .date,#blog-section .blog-card .blog-content .blog-meta .read-time{align-items:center;gap:4px;display:flex}#blog-section .blog-card .blog-content .blog-meta .date:before,#blog-section .blog-card .blog-content .blog-meta .read-time:before{content:"";background:linear-gradient(135deg,#06c,#00a8ff);border-radius:50%;width:4px;height:4px}#blog-section .blog-card .blog-content .blog-meta .separator{color:#06c;font-weight:700}#blog-section .blog-card .blog-content .blog-title{color:#1a1a1a;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:56px;margin-bottom:12px;font-size:20px;font-weight:700;line-height:1.4;transition:color .3s;display:-webkit-box;overflow:hidden}#blog-section .blog-card .blog-content .blog-title:hover{color:#06c}@media (max-width:768px){#blog-section .blog-card .blog-content .blog-title{min-height:50px;font-size:18px}}#blog-section .blog-card .blog-content .blog-excerpt{color:#666;-webkit-line-clamp:3;-webkit-box-orient:vertical;flex-grow:1;margin-bottom:18px;font-size:14px;line-height:1.7;display:-webkit-box;overflow:hidden}#blog-section .blog-card .blog-content .blog-footer{border-top:2px solid #f0f0f0;justify-content:space-between;align-items:center;padding-top:16px;display:flex}#blog-section .blog-card .blog-content .blog-footer .author{align-items:center;gap:10px;display:flex}#blog-section .blog-card .blog-content .blog-footer .author .author-avatar{color:#fff;background:linear-gradient(135deg,#06c 0%,#00a8ff 100%);border-radius:50%;justify-content:center;align-items:center;width:38px;height:38px;font-size:14px;font-weight:700;transition:all .3s;display:flex;box-shadow:0 4px 12px #0066cc40}#blog-section .blog-card .blog-content .blog-footer .author .author-avatar:hover{transform:scale(1.1)rotate(5deg)}#blog-section .blog-card .blog-content .blog-footer .author .author-name{color:#333;font-size:14px;font-weight:600}#blog-section .blog-card .blog-content .blog-footer .read-more{color:#06c;padding-right:20px;font-size:14px;font-weight:700;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative}#blog-section .blog-card .blog-content .blog-footer .read-more:after{content:"→";transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;right:0}#blog-section .blog-card .blog-content .blog-footer .read-more:hover{color:#0052a3}#blog-section .blog-card .blog-content .blog-footer .read-more:hover:after{right:-5px}#blog-section .loading{text-align:center;color:#666;padding:60px;font-size:18px}@media (max-width:1024px){#blog .text-box{max-width:70%}.blog-section{padding:40px 20px}.blog-section .category-filters{margin-bottom:30px}}@media (max-width:768px){#blog .text-box{max-width:90%}.blog-section{padding:30px 16px}.blog-section .category-filters{gap:8px}.blog-section .category-filters .filter-btn{padding:10px 18px;font-size:14px}.blog-section .blog-grid{gap:24px}.blog-section .blog-card .blog-image{height:200px}.blog-section .blog-card .blog-content{padding:20px}.blog-section .blog-card .blog-content .blog-footer{flex-direction:column;align-items:flex-start;gap:12px}}@media (max-width:480px){#blog .text-box{max-width:90%}#blog .text-box h1{font-size:35px}#blog .text-box p{font-size:15px}.blog-section .category-filters .filter-btn{padding:8px 14px;font-size:13px}.blog-section .blog-card .blog-content{padding:16px}.blog-section .blog-card .blog-content .blog-title{min-height:auto;font-size:18px}.blog-section .blog-card .blog-content .blog-excerpt{font-size:14px}}.loading-container{background:linear-gradient(135deg,#f5f7fa 0%,#c3cfe2 100%);flex-direction:column;justify-content:center;align-items:center;min-height:100vh;display:flex;position:relative}.loading-container:before{content:"";pointer-events:none;background:radial-gradient(circle at 20%,#0066cc0d 0%,#0000 50%),radial-gradient(circle at 80% 80%,#00a8ff0d 0%,#0000 50%);position:absolute;inset:0}.loading-container .loader{z-index:1;gap:12px;margin-bottom:24px;display:flex}.loading-container .loader .loader-circle{background:linear-gradient(135deg,#06c 0%,#00a8ff 100%);border-radius:50%;width:16px;height:16px;animation:1.4s ease-in-out infinite bounce;box-shadow:0 4px 12px #0066cc4d}.loading-container .loader .loader-circle:first-child{animation-delay:-.32s}.loading-container .loader .loader-circle:nth-child(2){animation-delay:-.16s}.loading-container .loader .loader-circle:nth-child(3){animation-delay:0s}.loading-container .loading-text{color:#06c;z-index:1;font-size:18px;font-weight:600;animation:1.4s ease-in-out infinite pulse}@keyframes bounce{0%,80%,to{opacity:.7;transform:scale(.8)translateY(0)}40%{opacity:1;transform:scale(1.2)translateY(-20px)}}@keyframes pulse{0%,to{opacity:.6}50%{opacity:1}}