.hafo-blog-grid,.hafo-blog-grid *,.hafo-blog-grid :after,.hafo-blog-grid :before{box-sizing:border-box}.hafo-blog-grid__heading{font-size:var(--hafo-font-size-3xl);font-weight:var(--hafo-font-weight-semibold);line-height:var(--hafo-line-height-tight);margin:0 0 var(--hafo-space-4);max-width:952px;padding:0}.hafo-blog-grid__heading,.hafo-blog-grid__no-posts{color:var(--hafo-color-text-primary);font-family:var(--hafo-font-family)}.hafo-blog-grid__no-posts{font-size:var(--hafo-font-size-lg);padding:var(--hafo-space-8) var(--hafo-space-3);text-align:center;width:100%}.hafo-blog-grid__filters{margin-bottom:var(--hafo-space-6)}.hafo-blog-grid__filter-btn{background-color:transparent;border:var(--hafo-border-width-1) solid var(--hafo-color-brand);border-radius:100px;color:var(--hafo-color-brand);cursor:pointer;font-family:var(--hafo-font-family);font-size:var(--hafo-font-size-base);font-weight:var(--hafo-font-weight-normal);line-height:var(--hafo-line-height-loose);padding:var(--hafo-space-1) var(--hafo-space-3-5);transition:all .3s ease;white-space:nowrap}.hafo-blog-grid__filter-btn:hover{box-shadow:var(--hafo-shadow-md);transform:translateY(-2px)}.hafo-blog-grid__filter-btn--active,.hafo-blog-grid__filter-btn:hover{background-color:var(--hafo-color-brand);color:var(--hafo-color-text-inverted)}.hafo-blog-grid__filter-btn:disabled{cursor:not-allowed;opacity:.5;pointer-events:none}.hafo-blog-grid__post{background-color:var(--hafo-color-bg-secondary);border:var(--hafo-border-width-1) solid var(--hafo-color-neutral-300);border-radius:var(--hafo-radius-md);display:flex;flex-direction:column;opacity:1;overflow:hidden;transform:translateY(0);transition:all .3s ease;width:calc((100% - var(--hafo-space-6))/3)}.hafo-blog-grid__post:hover{box-shadow:var(--hafo-shadow-lg);transform:translateY(-4px)}.hafo-blog-grid__post-image{height:174px;overflow:hidden;position:relative;width:100%}.hafo-blog-grid__post-image a,.hafo-blog-grid__post-image img{display:block;height:100%;width:100%}.hafo-blog-grid__post-image img{-o-object-fit:cover;object-fit:cover;transition:transform .4s ease}.hafo-blog-grid__post:hover .hafo-blog-grid__post-image img{transform:scale(1.05)}.hafo-blog-grid__post-content{display:flex;flex:1;flex-direction:column;gap:var(--hafo-space-1);padding:var(--hafo-space-3)}.hafo-blog-grid__post-title{color:var(--hafo-color-text-primary);font-family:var(--hafo-font-family);font-size:var(--hafo-font-size-xl);font-weight:var(--hafo-font-weight-semibold);line-height:var(--hafo-line-height-tight);margin:0;padding:0}.hafo-blog-grid__post-title a{color:inherit;-webkit-text-decoration:none;text-decoration:none;transition:color .3s ease}.hafo-blog-grid__post-title a:hover{color:#dd0908}.hafo-blog-grid__post-excerpt{color:var(--hafo-color-neutral-900);flex:1;font-weight:var(--hafo-font-weight-light);line-height:var(--hafo-line-height-normal);margin:0}.hafo-blog-grid__post-button,.hafo-blog-grid__post-excerpt{font-family:var(--hafo-font-family);font-size:var(--hafo-font-size-base)}.hafo-blog-grid__post-button{align-items:center;align-self:flex-start;background-color:var(--hafo-color-brand);border-radius:100px;color:var(--hafo-color-text-inverted);display:inline-flex;font-weight:var(--hafo-font-weight-normal);justify-content:center;line-height:var(--hafo-line-height-loose);margin-top:auto;padding:var(--hafo-space-1) var(--hafo-space-3-5);-webkit-text-decoration:none;text-decoration:none;transition:all .3s ease}.hafo-blog-grid__post-button:hover{background-color:#dd0908;transform:translate(4px)}.hafo-blog-grid__skeleton{background-color:var(--hafo-color-bg-card);display:flex;flex-wrap:wrap;gap:var(--hafo-space-3);left:0;opacity:1!important;padding:0;position:absolute;top:0;visibility:visible!important;width:100%;z-index:10}.hafo-blog-grid__skeleton-item{background-color:var(--hafo-color-bg-secondary);border:var(--hafo-border-width-1) solid var(--hafo-color-neutral-300);border-radius:var(--hafo-radius-md);display:flex;flex-direction:column;overflow:hidden;width:calc((100% - var(--hafo-space-6))/3)}.hafo-blog-grid__skeleton-image{animation:skeleton-loading 1.5s ease-in-out infinite;background:linear-gradient(90deg,#d2d6df 25%,#e8ebf0,#d2d6df 75%);background-size:200% 100%;height:174px;width:100%}.hafo-blog-grid__skeleton-content{display:flex;flex-direction:column;gap:var(--hafo-space-1-5);padding:var(--hafo-space-3)}.hafo-blog-grid__skeleton-title{height:24px;width:80%}.hafo-blog-grid__skeleton-text,.hafo-blog-grid__skeleton-title{animation:skeleton-loading 1.5s ease-in-out infinite;background:linear-gradient(90deg,#d2d6df 25%,#e8ebf0,#d2d6df 75%);background-size:200% 100%;border-radius:4px}.hafo-blog-grid__skeleton-text{height:60px;width:100%}.hafo-blog-grid__skeleton-button{animation:skeleton-loading 1.5s ease-in-out infinite;background:linear-gradient(90deg,#d2d6df 25%,#e8ebf0,#d2d6df 75%);background-size:200% 100%;border-radius:100px;height:48px;margin-top:8px;width:120px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.hafo-blog-grid--loading .hafo-blog-grid__posts>.hafo-blog-grid__post{opacity:0;pointer-events:none}.hafo-blog-grid--loading .hafo-blog-grid__skeleton{display:flex!important;opacity:1!important;visibility:visible!important}@media screen and (max-width:1200px){.hafo-blog-grid__heading{font-size:28px;line-height:32px}.hafo-blog-grid__post,.hafo-blog-grid__skeleton-item{width:calc(33.33333% - 16px)}}@media screen and (max-width:992px){.hafo-blog-grid__heading{font-size:26px;line-height:30px;margin-bottom:28px}.hafo-blog-grid__filters{gap:12px;margin-bottom:40px}.hafo-blog-grid__filter-btn{font-size:15px;padding:6px 24px}.hafo-blog-grid__post,.hafo-blog-grid__skeleton-item{width:calc(50% - 12px)}.hafo-blog-grid__posts,.hafo-blog-grid__skeleton{gap:20px}}@media screen and (max-width:768px){.hafo-blog-grid__heading{font-size:24px;line-height:28px;margin-bottom:24px}.hafo-blog-grid__filters{gap:10px;margin-bottom:32px}.hafo-blog-grid__filter-btn{font-size:14px;line-height:28px;padding:6px 20px}.hafo-blog-grid__post,.hafo-blog-grid__skeleton-item{width:calc(50% - 10px)}.hafo-blog-grid__posts,.hafo-blog-grid__skeleton{gap:16px}.hafo-blog-grid__post-image,.hafo-blog-grid__skeleton-image{height:150px}.hafo-blog-grid__post-content{padding:20px}.hafo-blog-grid__post-title{font-size:18px;line-height:28px}.hafo-blog-grid__post-excerpt{font-size:14px;line-height:22px}.hafo-blog-grid__post-button{font-size:14px;line-height:28px;padding:6px 20px}}@media screen and (max-width:480px){.hafo-blog-grid__heading{font-size:22px;line-height:26px;margin-bottom:20px}.hafo-blog-grid__filters{gap:8px;margin-bottom:28px}.hafo-blog-grid__filter-btn{font-size:13px;line-height:26px;padding:4px 16px}.hafo-blog-grid__post,.hafo-blog-grid__skeleton-item{width:100%}.hafo-blog-grid__posts,.hafo-blog-grid__skeleton{gap:16px}.hafo-blog-grid__post-image,.hafo-blog-grid__skeleton-image{height:200px}.hafo-blog-grid__post-content{padding:16px}.hafo-blog-grid__post-title{font-size:16px;line-height:24px}.hafo-blog-grid__post-excerpt{font-size:13px;line-height:20px}.hafo-blog-grid__post-button{font-size:13px;line-height:26px;padding:6px 16px}}
