@layer pages{.blog-index{padding:var(--space-16) 0}.blog-index__container{max-width:var(--container-max);padding:0 var(--space-6);margin:0 auto}.blog-index__header{text-align:center;margin-bottom:var(--space-12)}.blog-index__title{font-size:var(--text-h1);letter-spacing:-1.5px;color:var(--neutral-900);margin-bottom:var(--space-4);font-weight:800}.blog-index__subtitle{font-size:var(--text-body-lg);color:var(--neutral-600);max-width:600px;margin:0 auto;line-height:1.6}.blog-index__layout{gap:var(--space-8);grid-template-columns:1fr;display:grid}@media (width>=1280px){.blog-index__layout{grid-template-columns:1fr 320px}}.blog-index__grid{gap:var(--space-6);grid-template-columns:1fr;display:grid}@media (width>=768px){.blog-index__grid{grid-template-columns:repeat(2,1fr)}}@media (width>=1280px){.blog-index__grid{grid-template-columns:repeat(2,1fr)}}.blog-index__load-more{text-align:center;margin-top:var(--space-10);grid-column:1/-1}.blog-card{background:var(--neutral-0);border:1px solid var(--neutral-100);border-radius:var(--radius-xl);box-shadow:var(--shadow-xs);transition:box-shadow var(--duration-state) var(--ease-out), transform var(--duration-state) var(--ease-out);flex-direction:column;display:flex;overflow:hidden}.blog-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.blog-card__image-wrapper{aspect-ratio:16/10;overflow:hidden}.blog-card__image{object-fit:cover;width:100%;height:100%;transition:transform .4s var(--ease-out)}.blog-card:hover .blog-card__image{transform:scale(1.05)}.blog-card__content{padding:var(--space-5);flex-direction:column;flex:1;display:flex}.blog-card__category{padding:var(--space-1) var(--space-3);background:var(--orange-50);color:var(--orange-700);font-size:var(--text-body-sm);border-radius:var(--radius-pill);margin-bottom:var(--space-3);transition:background var(--duration-fast) var(--ease-out);align-self:flex-start;font-weight:600;text-decoration:none;display:inline-block}.blog-card__category:hover{background:var(--orange-100)}.blog-card__title{font-size:var(--text-h4);color:var(--neutral-900);margin-bottom:var(--space-3);font-weight:600;line-height:1.3}.blog-card__title-link{color:inherit;transition:color var(--duration-fast) var(--ease-out);text-decoration:none}.blog-card__title-link:hover{color:var(--orange-600)}.blog-card__excerpt{font-size:var(--text-body-sm);color:var(--neutral-600);margin-bottom:var(--space-4);-webkit-line-clamp:3;-webkit-box-orient:vertical;flex:1;line-height:1.6;display:-webkit-box;overflow:hidden}.blog-card__meta{padding-top:var(--space-4);border-top:1px solid var(--neutral-100);font-size:var(--text-body-sm);color:var(--neutral-500);justify-content:space-between;align-items:center;display:flex}.blog-card__author{align-items:center;gap:var(--space-2);display:flex}.blog-card__avatar{width:var(--space-7);height:var(--space-7);object-fit:cover;border-radius:50%}.blog-card--no-media{background:var(--surface-alt);align-self:start}.blog-card--no-media:before{content:"";flex:0 0 var(--space-1);background:var(--orange-600)}.blog-card--no-media .blog-card__content{padding-top:var(--space-6)}.blog-card--no-media .blog-card__category{background:var(--neutral-0)}.blog-card--no-media .blog-card__category:hover{background:var(--orange-100)}.blog-card--no-media .blog-card__title{font-size:var(--text-h3);letter-spacing:-.5px}.blog-card--no-media .blog-card__excerpt{font-size:var(--text-body);-webkit-line-clamp:6}@media (width>=768px){.blog-card--no-media .blog-card__excerpt{-webkit-line-clamp:9}}.blog-card--no-media .blog-card__meta{border-top-color:var(--neutral-200)}.blog-card--no-media .blog-card__meta,.blog-card--no-media .blog-card__meta time,.blog-card--no-media .blog-card__author span{color:var(--neutral-600)}.blog-sidebar{gap:var(--space-6);flex-direction:column;display:flex}@media (width>=1280px){.blog-sidebar{top:var(--space-16);align-self:start;position:sticky}}.blog-sidebar__widget{background:var(--neutral-0);border:1px solid var(--neutral-100);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-xs)}.blog-sidebar__title{font-size:var(--text-h4);color:var(--neutral-900);margin-bottom:var(--space-4);align-items:center;gap:var(--space-2);font-weight:600;display:flex}.blog-sidebar__title .icon{width:var(--space-5);height:var(--space-5);color:var(--orange-600)}.category-list{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.category-list__item{padding:var(--space-2) 0}.category-list__item:not(:last-child){border-bottom:1px solid var(--neutral-100)}.category-list__link{color:var(--neutral-700);font-size:var(--text-body);transition:color var(--duration-fast) var(--ease-out);justify-content:space-between;align-items:center;font-weight:500;text-decoration:none;display:flex}.category-list__link:hover{color:var(--orange-600)}.category-list__count{padding:var(--space-1) var(--space-3);background:var(--neutral-100);color:var(--neutral-700);font-size:var(--text-body-sm);border-radius:var(--radius-pill);font-weight:600}.social-follow{gap:var(--space-3);flex-wrap:wrap;display:flex}.social-follow__link{width:var(--space-11);height:var(--space-11);background:var(--neutral-100);color:var(--neutral-700);border-radius:var(--radius-lg);transition:background var(--duration-state) var(--ease-out), transform var(--duration-state) var(--ease-out);justify-content:center;align-items:center;text-decoration:none;display:flex}.social-follow__link:hover{background:var(--orange-600);color:var(--neutral-0);transform:translateY(-2px)}.social-follow__link .icon{width:var(--space-5);height:var(--space-5)}.blog-post{padding:var(--space-16) 0}.blog-post__container{max-width:var(--container-max);padding:0 var(--space-6);margin:0 auto}.blog-post__layout{gap:var(--space-8);grid-template-columns:1fr;display:grid}@media (width>=1280px){.blog-post__layout{grid-template-columns:1fr 320px}}.blog-post__main{min-width:0}.blog-post__hero{margin-bottom:var(--space-8)}.blog-post__category{padding:var(--space-2) var(--space-4);background:var(--orange-50);color:var(--orange-700);font-size:var(--text-body-sm);border-radius:var(--radius-pill);margin-bottom:var(--space-4);transition:background var(--duration-fast) var(--ease-out);font-weight:600;text-decoration:none;display:inline-block}.blog-post__category:hover{background:var(--orange-100)}.blog-post__title{font-size:var(--text-h1);letter-spacing:-1.5px;color:var(--neutral-900);margin-bottom:var(--space-5);text-wrap:balance;font-weight:800;line-height:1.1}.blog-post__meta{align-items:center;gap:var(--space-4);font-size:var(--text-body-sm);color:var(--neutral-600);flex-wrap:wrap;display:flex}.blog-post__author{align-items:center;gap:var(--space-3);display:flex}.blog-post__author-avatar{width:var(--space-10);height:var(--space-10);object-fit:cover;border-radius:50%}.blog-post__author-name{color:var(--neutral-800);font-weight:600}.blog-post__author-role{color:var(--neutral-500)}.blog-post__date{align-items:center;gap:var(--space-2);display:flex}.blog-post__date .icon{width:var(--space-4);height:var(--space-4)}.blog-post__updated{align-items:center;gap:var(--space-2);color:var(--neutral-500);font-size:var(--text-body-sm);display:flex}.blog-post__updated .icon{width:var(--space-4);height:var(--space-4)}.blog-post__featured-image{margin-bottom:var(--space-8);border-radius:var(--radius-xl);box-shadow:var(--shadow-md);overflow:hidden}.blog-post__featured-image img{aspect-ratio:16/9;object-fit:cover;width:100%;height:auto;display:block}.blog-post__content{font-size:var(--text-body-lg);color:var(--neutral-700);max-width:65ch;line-height:1.75}.blog-post__content p{margin-bottom:1.5em}.blog-post__content h2,.blog-post__content h3,.blog-post__content h4{color:var(--neutral-900);margin-top:2em;margin-bottom:.75em;font-weight:700;line-height:1.2}.blog-post__content h2{font-size:var(--text-h2);letter-spacing:-1px}.blog-post__content h3{font-size:var(--text-h3);letter-spacing:-.5px}.blog-post__content h4{font-size:var(--text-h4)}.blog-post__content img{border-radius:var(--radius-lg);max-width:100%;height:auto;margin:var(--space-6) 0}.blog-post__content ul,.blog-post__content ol{margin-bottom:1.5em;padding-left:1.5em}.blog-post__content li{margin-bottom:.5em}.blog-post__content blockquote{border-left:4px solid var(--orange-600);padding-left:var(--space-6);margin:var(--space-8) 0;color:var(--neutral-600);font-style:italic}.blog-post__content a{color:var(--orange-600);text-underline-offset:2px;text-decoration:underline}.blog-post__content a:hover{color:var(--orange-700)}.blog-post__content code{background:var(--neutral-100);padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:.9em}.blog-post__content pre{background:var(--neutral-900);color:var(--neutral-0);padding:var(--space-5);border-radius:var(--radius-lg);margin:var(--space-6) 0;overflow-x:auto}.blog-post__content pre code{color:inherit;background:0 0;padding:0}.blog-figure{margin:var(--space-8) 0}.blog-figure img{border-radius:var(--radius-lg);width:100%;height:auto;box-shadow:var(--shadow-sm)}.blog-figure figcaption{margin-top:var(--space-3);font-size:var(--text-body-sm);color:var(--neutral-500);text-align:center;font-style:italic}.blog-post__tags{align-items:center;gap:var(--space-2);margin-top:var(--space-8);padding-top:var(--space-6);border-top:1px solid var(--neutral-100);flex-wrap:wrap;display:flex}.blog-post__tags-label{align-items:center;gap:var(--space-2);color:var(--neutral-500);font-size:var(--text-body-sm);margin-right:var(--space-2);font-weight:500;display:flex}.blog-post__tags-label .icon{width:var(--space-4);height:var(--space-4)}.blog-post__tag{padding:var(--space-1) var(--space-3);background:var(--neutral-100);color:var(--neutral-700);font-size:var(--text-body-sm);border-radius:var(--radius-pill);transition:background var(--duration-fast) var(--ease-out);font-weight:500;display:inline-block}.blog-post__tag:hover{background:var(--neutral-200)}.blog-post__navigation{gap:var(--space-4);margin-top:var(--space-10);padding-top:var(--space-8);border-top:1px solid var(--neutral-100);grid-template-columns:1fr;display:grid}@media (width>=768px){.blog-post__navigation{grid-template-columns:1fr 1fr}}.blog-post__nav-link{align-items:center;gap:var(--space-4);padding:var(--space-4);background:var(--neutral-0);border:1px solid var(--neutral-100);border-radius:var(--radius-lg);transition:box-shadow var(--duration-state) var(--ease-out), transform var(--duration-state) var(--ease-out);text-decoration:none;display:flex}.blog-post__nav-link:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.blog-post__nav-link--next{text-align:right;justify-content:flex-end}.blog-post__nav-image{width:var(--space-16);height:var(--space-16);border-radius:var(--radius-md);object-fit:cover;flex-shrink:0}.blog-post__nav-content{gap:var(--space-1);flex-direction:column;display:flex}.blog-post__nav-label{font-size:var(--text-body-sm);color:var(--neutral-500);align-items:center;gap:var(--space-2);display:flex}.blog-post__nav-label .icon{width:var(--space-4);height:var(--space-4)}.blog-post__nav-title{font-size:var(--text-body);color:var(--neutral-900);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-weight:600;line-height:1.4;display:-webkit-box;overflow:hidden}.blog-post__sidebar{gap:var(--space-6);flex-direction:column;display:flex}@media (width>=1280px){.blog-post__sidebar{top:var(--space-16);align-self:start;position:sticky}}.share-widget{background:var(--neutral-0);border:1px solid var(--neutral-100);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-xs)}.share-widget__title{font-size:var(--text-h4);color:var(--neutral-900);margin-bottom:var(--space-4);align-items:center;gap:var(--space-2);font-weight:600;display:flex}.share-widget__title .icon{width:var(--space-5);height:var(--space-5);color:var(--orange-600)}.share-widget__buttons{gap:var(--space-2);flex-wrap:wrap;display:flex}.share-widget__button{width:var(--space-10);height:var(--space-10);background:var(--neutral-100);color:var(--neutral-700);border-radius:var(--radius-lg);cursor:pointer;transition:background var(--duration-state) var(--ease-out), transform var(--duration-state) var(--ease-out);border:none;justify-content:center;align-items:center;text-decoration:none;display:flex}.share-widget__button:hover{background:var(--orange-600);color:var(--neutral-0);transform:translateY(-2px)}.share-widget__button .icon{width:var(--space-5);height:var(--space-5)}.related-posts{background:var(--neutral-0);border:1px solid var(--neutral-100);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-xs)}.related-posts__title{font-size:var(--text-h4);color:var(--neutral-900);margin-bottom:var(--space-4);align-items:center;gap:var(--space-2);font-weight:600;display:flex}.related-posts__title .icon{width:var(--space-5);height:var(--space-5);color:var(--orange-600)}.related-posts__list{gap:var(--space-4);flex-direction:column;display:flex}.related-post{align-items:center;gap:var(--space-4);transition:transform var(--duration-state) var(--ease-out);text-decoration:none;display:flex}.related-post:hover{transform:translate(4px)}.related-post__image{width:var(--space-16);height:var(--space-16);border-radius:var(--radius-md);object-fit:cover;flex-shrink:0}.related-post--no-media:before{content:"";flex:0 0 var(--space-16);min-height:var(--space-16);border-left:var(--space-0-5) solid var(--orange-200);align-self:stretch}.related-post__content{gap:var(--space-1);flex-direction:column;min-width:0;display:flex}.related-post__title{font-size:var(--text-body);color:var(--neutral-900);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-weight:600;line-height:1.4;display:-webkit-box;overflow:hidden}.related-post__date{font-size:var(--text-body-sm);color:var(--neutral-500);align-items:center;gap:var(--space-2);display:flex}.related-post__date .icon{width:var(--space-4);height:var(--space-4)}.blog-category{padding:var(--space-16) 0}.blog-category__container{max-width:var(--container-max);padding:0 var(--space-6);margin:0 auto}.blog-category__header{text-align:center;margin-bottom:var(--space-12)}.blog-category__title{font-size:var(--text-h1);letter-spacing:-1.5px;color:var(--neutral-900);margin-bottom:var(--space-4);font-weight:800}.blog-category__subtitle{font-size:var(--text-body-lg);color:var(--neutral-600);max-width:600px;margin:0 auto;line-height:1.6}}