.blog-hero{color:#fff;text-align:center;background:linear-gradient(160deg,#001a33 0%,#002d5c 35%,#003d7a 70%,#024 100%);padding:64px 0 56px;position:relative;overflow:hidden}.blog-hero:before{content:"";background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400'%3E%3Ccircle cx='200' cy='200' r='200' fill='rgba(0,153,255,0.06)'/%3E%3Ccircle cx='1200' cy='100' r='150' fill='rgba(240,165,0,0.04)'/%3E%3C/svg%3E") 50%/cover no-repeat;position:absolute;inset:0}.blog-hero h1{margin-bottom:12px;font-size:2.5rem;font-weight:800;position:relative}.blog-hero p{opacity:.8;font-size:1.05rem;position:relative}.featured-post{color:inherit;background:#fff;border:1px solid #e5e7eb;border-radius:20px;grid-template-columns:1.2fr 1fr;gap:0;margin-bottom:48px;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:grid;overflow:hidden}.featured-post:hover{color:inherit;transform:translateY(-4px);box-shadow:0 12px 40px #0033661a}.featured-img{min-height:320px;position:relative;overflow:hidden}.featured-img img{object-fit:cover;width:100%;height:100%;transition:transform .5s}.featured-post:hover .featured-img img{transform:scale(1.05)}.featured-badge{color:#fff;z-index:1;letter-spacing:.5px;background:linear-gradient(135deg,#f0a500,#d48900);border-radius:50px;padding:5px 14px;font-size:.72rem;font-weight:700;position:absolute;top:16px;left:16px}.featured-body{flex-direction:column;justify-content:center;padding:40px 36px;display:flex}.featured-body .date{color:#6b7280;margin-bottom:12px;font-size:.8rem}.featured-body h2{color:#1a1a2e;margin-bottom:14px;font-size:1.5rem;font-weight:800;line-height:1.4}.featured-body p{color:#4b5563;-webkit-line-clamp:4;-webkit-box-orient:vertical;margin-bottom:20px;font-size:.9rem;line-height:1.8;display:-webkit-box;overflow:hidden}.featured-body .read-more{color:#06c;font-size:.9rem;font-weight:700}.blog-section-title{color:#1a1a2e;border-bottom:2px solid #f0a500;margin-bottom:24px;padding-bottom:12px;font-size:1.3rem;font-weight:700;display:inline-block}.blog-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;padding-bottom:56px;display:grid}.blog-card{color:inherit;background:#fff;border:1px solid #e5e7eb;border-radius:16px;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:block;overflow:hidden}.blog-card:hover{color:inherit;border-color:#09f;transform:translateY(-4px);box-shadow:0 8px 30px #00336614}.blog-card-image{color:#036;letter-spacing:1px;background:linear-gradient(135deg,#f0f4f8,#e2e8f0);justify-content:center;align-items:center;height:200px;font-size:1.1rem;font-weight:800;display:flex;position:relative;overflow:hidden}.blog-card-image img{object-fit:cover;width:100%;height:100%;transition:transform .4s}.blog-card:hover .blog-card-image img{transform:scale(1.05)}.blog-card-image .date-badge{backdrop-filter:blur(4px);color:#fff;z-index:1;background:#003366d9;border-radius:50px;padding:4px 12px;font-size:.7rem;font-weight:500;position:absolute;top:12px;right:12px}.blog-card-body{padding:20px}.blog-card-body .tags{flex-wrap:wrap;gap:6px;margin-bottom:10px;display:flex}.blog-card-body .tag{color:#06c;background:#0099ff14;border-radius:50px;padding:3px 10px;font-size:.68rem;font-weight:600}.blog-card-body h3{color:#1a1a2e;margin-bottom:8px;font-size:1rem;font-weight:700;line-height:1.5}.blog-card-body p{color:#6b7280;-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:.875rem;line-height:1.7;display:-webkit-box;overflow:hidden}.blog-card-footer{padding:0 20px 18px}.blog-card-footer span{color:#06c;font-size:.82rem;font-weight:600}.empty-state{text-align:center;color:#9ca3af;padding:80px 0;font-size:1.1rem}.blog-cta{color:#fff;text-align:center;background:linear-gradient(135deg,#036,#06c);padding:56px 0;position:relative;overflow:hidden}.blog-cta:before{content:"";background:radial-gradient(circle at 30%,#0099ff26,#0000 60%);position:absolute;inset:0}.blog-cta h2{margin-bottom:12px;font-size:1.6rem;font-weight:700;position:relative}.blog-cta p{opacity:.85;margin-bottom:24px;font-size:.95rem;position:relative}.blog-cta-btns{flex-wrap:wrap;justify-content:center;gap:12px;display:flex;position:relative}.blog-cta-btn{color:#fff;border-radius:50px;align-items:center;gap:8px;padding:14px 32px;font-size:.95rem;font-weight:700;text-decoration:none;transition:all .25s;display:inline-flex}.blog-cta-btn.products{background:linear-gradient(135deg,#f0a500,#d48900);box-shadow:0 4px 14px #f0a5004d}.blog-cta-btn.products:hover{color:#fff;transform:translateY(-2px);box-shadow:0 6px 20px #f0a50066}.blog-cta-btn.contact{background:#ffffff26;border:1px solid #ffffff4d}.blog-cta-btn.contact:hover{color:#fff;background:#ffffff40}@media (max-width:768px){.blog-hero h1{font-size:1.6rem}.featured-post{grid-template-columns:1fr}.featured-img{min-height:200px}.featured-body{padding:24px 20px}.featured-body h2{font-size:1.2rem}.blog-grid{grid-template-columns:1fr}.blog-cta h2{font-size:1.3rem}.blog-cta-btns{flex-direction:column;align-items:center}}.blog-pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin-top:48px;margin-bottom:24px;display:flex}.page-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:8px;justify-content:center;align-items:center;min-width:40px;height:40px;padding:0 10px;font-size:.9rem;font-weight:500;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1);display:inline-flex}.page-btn:hover{color:#1a3c6e;background:#f8fafc;border-color:#cbd5e1;transform:translateY(-1px)}.page-btn.active{color:#fff;background:#1a3c6e;border-color:#1a3c6e;font-weight:700;box-shadow:0 4px 12px #1a3c6e33}.page-btn.active:hover{color:#fff;background:#1a3c6e;transform:none}.page-btn.num-btn{width:40px;padding:0}.page-btn.nav-btn{border-color:#e2e8f0;gap:6px;font-weight:600}.page-btn.nav-btn svg{width:16px;height:16px;transition:transform .2s}.page-btn.nav-btn:hover svg{transform:translate(-2px)}.page-btn.nav-btn.next:hover svg{transform:translate(2px)}.page-ellipsis{color:#94a3b8;user-select:none;justify-content:center;align-items:center;width:40px;height:40px;font-size:1.1rem;display:inline-flex}
