.blog-listing{position:relative;--blog-media-width:10.5rem}@media (min-width:1024px){.blog-listing{--blog-media-width:12.5rem}}.blog-listing-grid{display:grid;grid-template-columns:1fr;align-items:stretch;gap:1.25rem}.blog-listing-grid>li{display:flex;min-height:0}@media (min-width:768px){.blog-listing-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}}.blog-card--featured{grid-column:1/-1}@media (min-width:1280px){.blog-listing-grid{gap:2rem}}.blog-card{position:relative;display:flex;flex:1 1 auto;width:100%;flex-direction:column;align-items:stretch;overflow:hidden;border-radius:1rem;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.02);transition:border-color .35s ease,transform .35s ease,box-shadow .35s ease}.blog-card:hover{border-color:rgba(255,255,255,.22);transform:translateY(-2px);box-shadow:0 12px 40px rgba(0,0,0,.28)}.blog-card-link{display:flex;flex-direction:column;flex:1 1 auto;align-self:stretch;width:100%;min-height:0;color:inherit;text-decoration:none;outline:none}@media (min-width:768px){.blog-card-link{display:flex;flex-direction:row;align-items:stretch;flex:1 1 auto;height:100%}.blog-card-media{flex:0 0 var(--blog-media-width);width:var(--blog-media-width);height:100%;align-self:stretch;aspect-ratio:auto}.blog-card-body{flex:1 1 auto;justify-content:center;min-width:0;padding:1.125rem 1.25rem 1.25rem 1rem;gap:.625rem}.blog-card-media-gradient{background:linear-gradient(90deg,transparent 55%,rgba(15,23,42,.35))}.blog-card-title{font-size:1.125rem}.blog-card-short-title{font-size:.9375rem;-webkit-line-clamp:2;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}.blog-card--featured .blog-card-title{font-size:1.375rem}.blog-card--featured .blog-card-short-title{font-size:1rem;-webkit-line-clamp:3}}@media (min-width:1024px){.blog-card-body{padding:1.25rem 1.5rem 1.5rem 1.125rem;gap:.75rem}.blog-card-title{font-size:1.25rem}.blog-card--featured .blog-card-title{font-size:1.5rem}}.blog-card-link:focus-visible{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.blog-card-media{position:relative;flex-shrink:0;aspect-ratio:16/10;overflow:hidden;background:rgba(255,255,255,.04)}.blog-card-media img{transition:transform .5s ease}.blog-card:hover .blog-card-media img{transform:scale(1.04)}.blog-card-media-gradient{position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(15,23,42,.75));pointer-events:none}.blog-card-body{display:flex;flex:1 1 auto;flex-direction:column;gap:.875rem;padding:1.25rem 1.25rem 1.5rem;min-width:0;position:relative;z-index:1}@media (min-width:768px){.blog-card{border-radius:1.25rem}}.blog-card-tags{display:flex;flex-wrap:wrap;gap:.5rem}.blog-card-tag{display:inline-flex;align-items:center;padding:.25rem .625rem;border-radius:9999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);font-size:.6875rem;font-weight:500;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.85)}.blog-card-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;font-size:.8125rem;color:rgba(255,255,255,.55)}.blog-card-meta-sep{color:rgba(255,255,255,.28)}.blog-card-title{font-size:1.25rem;font-weight:500;line-height:1.35;color:#fff;transition:color .3s ease}.blog-card:hover .blog-card-title{color:rgba(230,225,245,.95)}.blog-card-short-title{font-size:1rem;line-height:1.5;font-weight:500;color:rgba(255,255,255,.78)}.blog-card-excerpt{flex:1;font-size:.9375rem;line-height:1.6;color:rgba(255,255,255,.62);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.blog-card--featured .blog-card-excerpt{-webkit-line-clamp:4}.blog-card-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-top:.25rem}.blog-card-read{display:inline-flex;align-items:center;gap:.375rem;font-size:.875rem;font-weight:500;color:rgba(255,255,255,.9);transition:gap .25s ease,color .25s ease}.blog-card:hover .blog-card-read{gap:.625rem;color:#fff}.blog-card-read-icon{display:inline-flex;width:1.25rem;height:1.25rem;transition:transform .25s ease}.blog-card:hover .blog-card-read-icon{transform:translateX(3px)}