.blog-posts-page{background:linear-gradient(135deg,hsl(var(--background))0%,hsl(var(--muted)/.3)100%);scroll-behavior:smooth;min-height:100vh}.blog-hero{background:linear-gradient(135deg,hsl(var(--primary)/.05)0%,hsl(var(--accent)/.05)100%);border-bottom:1px solid hsl(var(--border));position:relative;overflow:hidden}.blog-hero:before{content:"";background:radial-gradient(circle,hsl(var(--primary)/.1)0%,transparent 70%);width:100%;height:100%;animation:20s ease-in-out infinite float;position:absolute;top:-50%;right:-50%}.blog-hero:after{content:"";background:radial-gradient(circle,hsl(var(--accent)/.08)0%,transparent 70%);width:100%;height:100%;animation:25s ease-in-out infinite reverse float;position:absolute;bottom:-50%;left:-50%}@keyframes float{0%,to{transform:translate(0)rotate(0)}33%{transform:translate(30px,-30px)rotate(120deg)}66%{transform:translate(-20px,20px)rotate(240deg)}}.blog-icon-container{background:linear-gradient(135deg,hsl(var(--primary)/.1)0%,hsl(var(--accent)/.1)100%);animation:3s ease-in-out infinite pulse-glow;position:relative}@keyframes pulse-glow{0%,to{box-shadow:0 0 0 0 hsl(var(--primary)/.4)}50%{box-shadow:0 0 20px 5px hsl(var(--primary)/.2)}}.blog-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2rem;animation:.6s ease-out fadeInUp;display:grid}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.blog-card{background:hsl(var(--card));border:1px solid hsl(var(--border));cursor:pointer;border-radius:1rem;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.blog-card:before{content:"";background:linear-gradient(90deg,hsl(var(--primary)),hsl(var(--accent)));transform-origin:0;z-index:10;height:3px;transition:transform .4s cubic-bezier(.4,0,.2,1);position:absolute;top:0;left:0;right:0;transform:scaleX(0)}.blog-card:hover{border-color:hsl(var(--primary)/.5);transform:translateY(-8px);box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.blog-card:hover:before{transform:scaleX(1)}.blog-card:active{transform:translateY(-6px)}.blog-thumbnail{aspect-ratio:16/9;display:block;position:relative;overflow:hidden}.blog-thumbnail-image{background-position:50%;background-size:cover;width:100%;height:100%;transition:transform .6s cubic-bezier(.4,0,.2,1)}.blog-card:hover .blog-thumbnail-image{transform:scale(1.1)rotate(1deg)}.blog-thumbnail-overlay{background:linear-gradient(to top,hsl(var(--background)/.8)0%,transparent 50%);opacity:0;transition:opacity .4s;position:absolute;inset:0}.blog-card:hover .blog-thumbnail-overlay{opacity:1}.blog-thumbnail-placeholder{background:linear-gradient(135deg,hsl(var(--primary)/.1)0%,hsl(var(--accent)/.1)50%,hsl(var(--secondary)/.1)100%);width:100%;height:100%;position:relative;overflow:hidden}.blog-thumbnail-placeholder:before{content:"";background:linear-gradient(90deg,transparent 0%,hsl(var(--background)/.1)50%,transparent 100%);animation:2s infinite shimmer;position:absolute;inset:0}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.blog-tags{flex-wrap:wrap;gap:.5rem;min-height:28px;display:flex}.blog-title{color:hsl(var(--foreground));-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:1.125rem;font-weight:700;line-height:1.4;transition:color .3s;display:-webkit-box;overflow:hidden}.blog-card:hover .blog-title{color:hsl(var(--primary))}.blog-meta{color:hsl(var(--muted-foreground));border-top:1px solid hsl(var(--border));align-items:center;gap:.75rem;padding-top:.75rem;font-size:.75rem;display:flex}.blog-meta-item{align-items:center;gap:.375rem;transition:color .3s;display:flex}.blog-meta-item:hover{color:hsl(var(--primary))}.reading-time{background:hsl(var(--accent)/.5);border-radius:.5rem;align-items:center;gap:.375rem;padding:.375rem .75rem;font-size:.75rem;font-weight:500;transition:all .3s;display:inline-flex}.blog-card:hover .reading-time{background:hsl(var(--accent)/.7);transform:translate(2px)}.blog-empty-state{text-align:center;padding:4rem 2rem;animation:.6s ease-out fadeIn}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.blog-empty-icon{background:linear-gradient(135deg,hsl(var(--muted))0%,hsl(var(--muted)/.5)100%);border-radius:50%;justify-content:center;align-items:center;width:5rem;height:5rem;margin:0 auto 1.5rem;animation:2s ease-in-out infinite bounce;display:flex}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@media (max-width:640px){.blog-grid{grid-template-columns:1fr;gap:1.5rem}.blog-card{border-radius:.75rem}.blog-hero{padding:2rem 0}}@media (min-width:1280px){.blog-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}}.blog-card:first-child{animation-delay:.1s}.blog-card:nth-child(2){animation-delay:.15s}.blog-card:nth-child(3){animation-delay:.2s}.blog-card:nth-child(4){animation-delay:.25s}.blog-card:nth-child(5){animation-delay:.3s}.blog-card:nth-child(6){animation-delay:.35s}.blog-card:nth-child(7){animation-delay:.4s}.blog-card:nth-child(8){animation-delay:.45s}.blog-card{animation:.6s ease-out backwards slideInUp}@keyframes slideInUp{0%{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes sparkle{0%,to{opacity:1;transform:scale(1)rotate(0)}50%{opacity:.8;transform:scale(1.2)rotate(180deg)}}.blog-hero .lucide-sparkles{animation:2s ease-in-out infinite sparkle}*{-webkit-tap-highlight-color:transparent}a{-webkit-touch-callout:none}