@layer features {
.blog-index{flex-direction:column;gap:40px;max-width:1180px;display:flex}.blog-index__hero,.blog-article__intro{flex-direction:column;gap:16px;display:flex}.blog-index__hero{border-bottom:1px solid var(--border-default);padding-bottom:36px}.blog-index__hero h1,.blog-article__hero h1{font-family:var(--font-heading);font-size:var(--title-2xl);font-weight:700;line-height:var(--title-2xl-line);max-width:880px}.blog-index__hero>p:not(.eyebrow),.blog-article__intro>p:not(.eyebrow){color:var(--text-muted);font-size:var(--body-l);line-height:var(--body-l-line);max-width:720px}.blog-index__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;display:grid}.blog-card{border:1px solid var(--border-default);border-radius:var(--radius-m);flex-direction:column;min-width:0;display:flex;overflow:hidden}.blog-card__media,.blog-image{background:var(--surface-media);display:block;position:relative}.blog-card__media{aspect-ratio:4/3}.blog-card__media .blog-image{width:100%;height:100%}.blog-card__placeholder{background:var(--surface-accent);height:100%}.blog-card__content{flex-direction:column;flex:1;gap:12px;padding:20px;display:flex}.blog-card h2{font-family:var(--font-heading);font-size:var(--title-s);font-weight:600;line-height:var(--title-s-line)}.blog-card h2 a{color:inherit;text-decoration:none}.blog-card h2 a:hover{color:var(--interactive-primary-hover)}.blog-card__content>p:not(.blog-meta){color:var(--text-muted);font-size:var(--body-m);line-height:var(--body-m-line)}.blog-index__empty{border:1px solid var(--border-default);border-radius:var(--radius-m);flex-direction:column;align-items:flex-start;gap:16px;padding:32px;display:flex}.blog-index__empty h2{font-family:var(--font-heading);font-size:var(--title-s);line-height:var(--title-s-line)}.blog-index__empty p{color:var(--text-muted);font-size:var(--body-m);line-height:var(--body-m-line)}.blog-meta{color:var(--text-subtle);font-size:var(--body-s);line-height:var(--body-s-line);flex-wrap:wrap;align-items:center;gap:8px;display:flex}.blog-article{padding-bottom:48px}.blog-article__hero{flex-direction:column;gap:32px;max-width:960px;display:flex}.blog-article__hero-image{aspect-ratio:16/9;background:var(--surface-media);border-radius:var(--radius-m);width:100%;position:relative;overflow:hidden}.blog-article__body{flex-direction:column;gap:40px;margin-top:44px;display:flex}.blog-article__content{max-width:840px}.blog-article__rich-text{flex-direction:column;gap:20px;display:flex}.blog-article__rich-text h2,.blog-article__rich-text h3,.blog-article__rich-text h4{color:var(--text-primary);font-family:var(--font-heading);margin-top:16px;font-weight:600}.blog-article__rich-text h2{font-size:var(--title-m);line-height:var(--title-m-line)}.blog-article__rich-text h3,.blog-article__rich-text h4{font-size:var(--title-s);line-height:var(--title-s-line)}.blog-article__rich-text p,.blog-article__rich-text li,.blog-article__rich-text blockquote{color:var(--text-muted);font-size:var(--body-m);line-height:var(--body-m-line)}.blog-article__rich-text a{color:var(--interactive-primary-hover);font-weight:600}.blog-article__rich-text ul,.blog-article__rich-text ol{flex-direction:column;gap:10px;margin:0;padding-left:24px;display:flex}.blog-article__rich-text blockquote{border-left:4px solid var(--interactive-primary);margin:8px 0;padding-left:20px}.blog-article__rich-text hr{background:var(--border-default);border:0;width:100%;height:1px}.rich-text__figure{flex-direction:column;gap:10px;margin:12px 0;display:flex}.rich-text__image-frame{aspect-ratio:16/9;background:var(--surface-media);border-radius:var(--radius-m);width:100%;position:relative;overflow:hidden}.rich-text__figure figcaption{color:var(--text-subtle);font-size:var(--body-s);line-height:var(--body-s-line)}.blog-article__reusable-block{overflow:hidden}.blog-article__reusable-block .homepage-popular,.blog-article__reusable-block .homepage-feature,.blog-article__reusable-block .homepage-series{margin-block:0}
}

@layer responsive {
@media (max-width:920px){.blog-index__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:620px){.blog-index{gap:28px}.blog-index__hero{padding-bottom:28px}.blog-index__hero h1,.blog-article__hero h1{font-size:32px;line-height:40px}.blog-index__hero>p:not(.eyebrow),.blog-article__intro>p:not(.eyebrow){font-size:var(--body-m);line-height:var(--body-m-line)}.blog-index__grid{grid-template-columns:1fr}.blog-card__content{padding:18px}.blog-article__hero{gap:24px}.blog-article__body{gap:32px;margin-top:32px}.blog-article__rich-text{gap:16px}}
}