@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap";
:root{--blog-primary:#2563eb;--blog-primary-dark:#1e40af;--blog-primary-light:#3b82f6;--blog-secondary:#8b5cf6;--blog-success:#10b981;--blog-text:#0f172a;--blog-text-muted:#64748b;--blog-text-light:#94a3b8;--blog-bg:#fff;--blog-bg-light:#f8fafc;--blog-border:#e5e7eb;--blog-shadow-sm:0 2px 8px #0000000a;--blog-shadow-md:0 4px 16px #00000014;--blog-shadow-lg:0 10px 40px #0000001f;--blog-shadow-xl:0 20px 60px #2563eb26;--blog-radius:16px;--blog-radius-lg:24px;--blog-transition:all .3s cubic-bezier(.4,0,.2,1)}.blogview-container{background:linear-gradient(#fff 0%,#f8fafc 100%);max-width:1280px;min-height:100vh;margin:0 auto;padding:3rem 1.5rem;font-family:Inter,system-ui,-apple-system,sans-serif;position:relative}.blogview-container:before{content:"";opacity:1;z-index:0;pointer-events:none;background-image:radial-gradient(circle at 20%,#2563eb08 0%,#0000 50%),radial-gradient(circle at 80% 80%,#8b5cf608 0%,#0000 50%),radial-gradient(circle at 40% 20%,#10b98105 0%,#0000 50%);background-size:100% 100%;position:absolute;inset:0}.blogview-container>*{z-index:1;position:relative}.blogview-header{text-align:center;margin-bottom:4rem;padding:2rem 0}.blogview-eyebrow{text-transform:uppercase;letter-spacing:.1em;color:var(--blog-primary);background:linear-gradient(135deg,#2563eb1a,#3b82f61a);border:1px solid #2563eb33;border-radius:999px;margin:0 0 1rem;padding:.5rem 1rem;font-size:.75rem;font-weight:700;display:inline-block}.blogview-title{color:var(--blog-text);letter-spacing:-.02em;background:linear-gradient(135deg,var(--blog-text)0%,var(--blog-primary)100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;margin:0 0 1rem;font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.2}.blogview-subtitle{color:var(--blog-text-muted);max-width:700px;margin:0 auto;font-size:clamp(1rem,2vw,1.25rem);line-height:1.6}.blogview-linkButton{background:linear-gradient(135deg,var(--blog-primary),var(--blog-primary-dark));color:#fff;transition:var(--blog-transition);border-radius:12px;align-items:center;gap:.5rem;padding:.875rem 2rem;font-size:.95rem;font-weight:600;text-decoration:none;display:inline-flex;box-shadow:0 10px 25px #2563eb4d}.blogview-linkButton:hover{background:linear-gradient(135deg,var(--blog-primary-light),var(--blog-primary));transform:translateY(-2px);box-shadow:0 15px 35px #2563eb66}.blogview-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:2rem;display:grid}.blogview-card{background:var(--blog-bg);border-radius:var(--blog-radius);box-shadow:var(--blog-shadow-md);border:1px solid var(--blog-border);color:inherit;transition:var(--blog-transition);flex-direction:column;gap:1rem;padding:2rem;text-decoration:none;display:flex;position:relative;overflow:hidden}.blogview-card:before{content:"";background:linear-gradient(90deg,var(--blog-primary),var(--blog-secondary));transform-origin:0;height:4px;transition:transform .3s;position:absolute;top:0;left:0;right:0;transform:scaleX(0)}.blogview-card:hover{box-shadow:var(--blog-shadow-xl);border-color:#2563eb33;transform:translateY(-4px)}.blogview-card:hover:before{transform:scaleX(1)}.blogview-cardHeader{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;display:flex}.blogview-badge{color:var(--blog-primary-dark);transition:var(--blog-transition);background:linear-gradient(135deg,#2563eb1a,#3b82f61a);border:1px solid #2563eb33;border-radius:999px;align-items:center;padding:.4rem .875rem;font-size:.85rem;font-weight:600;display:inline-flex}.blogview-card:hover .blogview-badge{background:linear-gradient(135deg,#2563eb26,#3b82f626);border-color:#2563eb4d}.blogview-date{color:var(--blog-text-muted);white-space:nowrap;align-items:center;font-size:.875rem;font-weight:500;display:inline-flex}.blogview-cardTitle{color:var(--blog-text);letter-spacing:-.01em;margin:0;font-size:1.5rem;font-weight:700;line-height:1.3;transition:color .2s}.blogview-card:hover .blogview-cardTitle{color:var(--blog-primary)}.blogview-excerpt{color:var(--blog-text-muted);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:.95rem;line-height:1.7;display:-webkit-box;overflow:hidden}.blogview-readMore{color:var(--blog-primary);transition:var(--blog-transition);align-items:center;gap:.5rem;width:fit-content;margin-top:auto;font-size:.95rem;font-weight:600;display:inline-flex}.blogview-card:hover .blogview-readMore{color:var(--blog-primary-dark);gap:.75rem}.blogview-readMore svg{transition:transform .3s}.blogview-card:hover .blogview-readMore svg{transform:translate(4px)}.blogview-loading{text-align:center;color:var(--blog-text-muted);flex-direction:column;align-items:center;gap:1rem;padding:4rem 2rem;font-size:1.1rem;display:flex}.blogview-loading-spinner{border:4px solid #2563eb1a;border-top-color:var(--blog-primary);border-radius:50%;width:48px;height:48px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.blogview-error,.blogview-empty{text-align:center;color:var(--blog-text-muted);padding:4rem 2rem;font-size:1.1rem}.blogview-empty{background:var(--blog-bg);border-radius:var(--blog-radius);border:2px dashed var(--blog-border);max-width:600px;margin:0 auto}.blogview-empty p{color:var(--blog-text-muted);margin:0;font-size:1.1rem}.blogview-error{color:#dc2626;border-radius:var(--blog-radius);background:linear-gradient(135deg,#ef44441a,#dc26261a);border:1px solid #ef444433;max-width:600px;margin:0 auto;font-weight:500}@media (max-width:768px){.blogview-container{padding:2rem 1rem}.blogview-header{margin-bottom:2.5rem;padding:1.5rem 0}.blogview-title{font-size:2rem}.blogview-subtitle{font-size:1rem}.blogview-grid{grid-template-columns:1fr;gap:1.5rem}.blogview-card{padding:1.5rem}.blogview-cardTitle{font-size:1.25rem}}.blogview-pagination{border-top:1px solid var(--blog-border);flex-direction:column;align-items:center;gap:1.5rem;margin-top:3rem;padding-top:2rem;display:flex}.blogview-pagination-info{color:var(--blog-text-muted);font-size:.9rem;font-weight:500}.blogview-pagination-controls{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;display:flex}.blogview-pagination-btn{background:var(--blog-bg);border:1px solid var(--blog-border);color:var(--blog-text);cursor:pointer;transition:var(--blog-transition);border-radius:10px;align-items:center;gap:.5rem;padding:.625rem 1.25rem;font-size:.9rem;font-weight:600;display:inline-flex}.blogview-pagination-btn:hover:not(:disabled){background:var(--blog-primary);color:#fff;border-color:var(--blog-primary);box-shadow:var(--blog-shadow-md);transform:translateY(-1px)}.blogview-pagination-btn:disabled{opacity:.4;cursor:not-allowed}.blogview-pagination-numbers{align-items:center;gap:.25rem;display:flex}.blogview-pagination-number{background:var(--blog-bg);border:1px solid var(--blog-border);min-width:40px;height:40px;color:var(--blog-text);cursor:pointer;transition:var(--blog-transition);border-radius:10px;justify-content:center;align-items:center;padding:0 .75rem;font-size:.9rem;font-weight:600;display:flex}.blogview-pagination-number:hover{border-color:var(--blog-primary);color:var(--blog-primary);background:#2563eb1a;transform:translateY(-1px)}.blogview-pagination-number.active{background:linear-gradient(135deg,var(--blog-primary),var(--blog-primary-dark));color:#fff;border-color:var(--blog-primary);box-shadow:0 4px 12px #2563eb4d}.blogview-pagination-ellipsis{color:var(--blog-text-muted);padding:0 .5rem;font-weight:600}@media (max-width:768px){.blogview-pagination{margin-top:2rem;padding-top:1.5rem}.blogview-pagination-controls{gap:.25rem}.blogview-pagination-btn{padding:.5rem 1rem;font-size:.85rem}.blogview-pagination-btn span{display:none}.blogview-pagination-number{min-width:36px;height:36px;padding:0 .5rem;font-size:.85rem}}@media (max-width:480px){.blogview-container{padding:1.5rem 1rem}.blogview-header{margin-bottom:2rem}.blogview-card{padding:1.25rem}.blogview-pagination-info{text-align:center;font-size:.85rem}.blogview-pagination-number{min-width:32px;height:32px;padding:0 .4rem;font-size:.8rem}}
