.blog-main[data-astro-cid-4dqtj3le]{min-height:calc(100vh - 200px);padding-top:calc(80px + var(--space-8));padding-bottom:var(--space-12)}.blog-container{max-width:1200px;margin:0 auto;padding:0 var(--space-5)}.blog-header{text-align:center;margin-bottom:var(--space-10)}.blog-header h1{font-family:var(--font-display);font-size:clamp(2.5rem,5vw,3.5rem);font-weight:700;color:var(--gray-12);margin-bottom:var(--space-4)}.blog-header p{font-size:1.125rem;color:var(--gray-10);max-width:600px;margin:0 auto}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}@media(max-width:1024px){.blog-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:640px){.blog-grid{grid-template-columns:1fr}}.blog-card{background:var(--gray-2);border:1px solid var(--gray-4);border-radius:var(--radius-5);overflow:hidden;transition:all var(--duration-slow) var(--ease-smooth)}.blog-card:hover{border-color:var(--gray-5);transform:translateY(-4px);box-shadow:0 20px 40px #0000004d}.blog-card__image{display:block;aspect-ratio:16/9;overflow:hidden;background:var(--gray-3)}.blog-card__image img{width:100%;height:100%;object-fit:cover;transition:transform var(--duration-slow) var(--ease-smooth)}.blog-card:hover .blog-card__image img{transform:scale(1.05)}.blog-card__content{padding:var(--space-5)}.blog-card__meta{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-3);font-size:.875rem;color:var(--gray-10)}.blog-card__tags{display:flex;gap:var(--space-2)}.blog-card__title{font-family:var(--font-display);font-size:1.25rem;font-weight:600;margin-bottom:var(--space-2);line-height:1.4}.blog-card__title a{color:var(--gray-12);text-decoration:none;transition:color var(--duration-fast) var(--ease-smooth)}.blog-card__title a:hover{color:var(--accent-9)}.blog-card__description{color:var(--gray-10);font-size:.9375rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.blog-post{max-width:800px;margin:0 auto;padding:0 var(--space-5)}.blog-post__header{margin-bottom:var(--space-8)}.blog-post__meta{display:flex;align-items:center;gap:var(--space-4);margin-bottom:var(--space-4);font-size:.9375rem;color:var(--gray-10)}.blog-post__title{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:700;color:var(--gray-12);line-height:1.2;margin-bottom:var(--space-4)}.blog-post__description{font-size:1.25rem;color:var(--gray-10);line-height:1.6}.blog-post__hero{margin-bottom:var(--space-8);border-radius:var(--radius-5);overflow:hidden}.blog-post__hero img{width:100%;height:auto}.blog-post__content{font-size:1.0625rem;line-height:1.8;color:var(--gray-11)}.blog-post__content h1,.blog-post__content h2,.blog-post__content h3,.blog-post__content h4{font-family:var(--font-display);color:var(--gray-12);font-weight:600;margin-top:var(--space-8);margin-bottom:var(--space-4)}.blog-post__content h1{font-size:2rem}.blog-post__content h2{font-size:1.5rem}.blog-post__content h3{font-size:1.25rem}.blog-post__content p{margin-bottom:var(--space-5)}.blog-post__content a{color:var(--accent-9);text-decoration:underline;text-underline-offset:2px;transition:color var(--duration-fast) var(--ease-smooth)}.blog-post__content a:hover{color:var(--accent-10)}.blog-post__content ul,.blog-post__content ol{margin-bottom:var(--space-5);padding-left:var(--space-6)}.blog-post__content li{margin-bottom:var(--space-2)}.blog-post__content strong{color:var(--gray-12);font-weight:600}.blog-post__content code{font-family:JetBrains Mono,monospace;font-size:.9em;background:var(--gray-3);padding:.2em .4em;border-radius:var(--radius-2)}.blog-post__content pre{background:var(--gray-2);border:1px solid var(--gray-4);border-radius:var(--radius-4);padding:var(--space-5);overflow-x:auto;margin-bottom:var(--space-5)}.blog-post__content pre code{background:none;padding:0}.blog-post__content blockquote{border-left:4px solid var(--accent-9);padding-left:var(--space-5);margin:var(--space-6) 0;color:var(--gray-10);font-style:italic}.blog-post__content img{max-width:100%;height:auto;border-radius:var(--radius-4);margin:var(--space-6) 0}.blog-post__content hr{border:none;border-top:1px solid var(--gray-4);margin:var(--space-8) 0}.language-switcher{position:relative}.language-switcher__trigger{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--gray-3);border:1px solid var(--gray-5);border-radius:var(--radius-3);color:var(--gray-11);font-size:.875rem;cursor:pointer;transition:all var(--duration-fast) var(--ease-smooth)}.language-switcher__trigger:hover{background:var(--gray-4);color:var(--gray-12)}.language-switcher__trigger[aria-expanded=true] .chevron{transform:rotate(180deg)}.language-switcher .chevron{transition:transform var(--duration-fast) var(--ease-smooth)}.language-switcher__menu{position:absolute;top:calc(100% + var(--space-1));right:0;min-width:160px;background:var(--gray-2);border:1px solid var(--gray-4);border-radius:var(--radius-3);box-shadow:0 10px 30px #0000004d;opacity:0;visibility:hidden;transform:translateY(-8px);transition:all var(--duration-fast) var(--ease-smooth);z-index:50;list-style:none;padding:0;margin:0}.language-switcher:focus-within .language-switcher__menu,.language-switcher__trigger[aria-expanded=true]+.language-switcher__menu{opacity:1;visibility:visible;transform:translateY(0)}.language-switcher__menu li{list-style:none}.language-switcher__menu a{display:block;padding:var(--space-2) var(--space-4);color:var(--gray-11);font-size:.875rem;text-decoration:none;transition:all var(--duration-fast) var(--ease-smooth)}.language-switcher__menu a:hover{background:var(--gray-3);color:var(--gray-12)}.language-switcher__menu a.current{color:var(--accent-9);font-weight:600}.tag-badge{display:inline-block;padding:var(--space-1) var(--space-2);background:var(--gray-3);border-radius:var(--radius-2);font-size:.75rem;color:var(--gray-11)}.blog-empty{text-align:center;padding:var(--space-12) var(--space-5)}.blog-empty p{color:var(--gray-10);font-size:1.125rem}.reading-time{display:flex;align-items:center;gap:var(--space-1);color:var(--gray-10)}.blog-grid.stagger>*{opacity:0;animation:fadeIn .5s var(--ease-smooth) forwards}.blog-grid.stagger>*:nth-child(1){animation-delay:.1s}.blog-grid.stagger>*:nth-child(2){animation-delay:.15s}.blog-grid.stagger>*:nth-child(3){animation-delay:.2s}.blog-grid.stagger>*:nth-child(4){animation-delay:.25s}.blog-grid.stagger>*:nth-child(5){animation-delay:.3s}.blog-grid.stagger>*:nth-child(6){animation-delay:.35s}
