@layer utils;@layer components{.post-tile{container-type:inline-size;text-decoration:none;transition-property:opacity;transition-duration:var(--g-easing-duration-default);transition-timing-function:var(--g-easing-hover)}.post-tile__inner{position:relative;display:flex;padding:2.4rem;text-decoration:none;background-color:var(--g-color-white);border:.1rem solid var(--g-color-gray-200);border-radius:var(--g-border-radius-medium);flex-direction:column}@container ((width >= 1024px)){.post-tile__inner{padding:3.6rem}}@media(hover:hover)and (pointer:fine){.post-tile:hover .post-tile__icon svg.-first{transform:translate(0)}.post-tile:hover .post-tile__icon svg.-second{transform:translate(175%)}}.post-tile__icon{position:relative;display:grid;place-items:center;width:4.8rem;height:4.8rem;margin:0 0 8rem;background-color:var(--g-color-white);border:.1rem solid var(--g-color-gray-200);border-radius:50%;transition-property:background-color;transition-duration:var(--g-easing-duration-default);transition-timing-function:var(--g-easing-hover);overflow:hidden}@container ((width >= 1024px)){.post-tile__icon{margin:0 0 12rem}}.post-tile__icon svg{grid-area:1/1;width:2rem;transition:transform var(--g-easing-duration-default) var(--g-easing-hover)}.post-tile__icon svg.-first{transform:translate(-175%)}.post-tile__heading{display:-webkit-box;max-width:36rem;margin-top:auto;margin-bottom:1.6rem;font-size:2.4rem;text-wrap:balance;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}@container ((width >= 1024px)){.post-tile__heading{margin-bottom:2.8rem;font-size:3rem}}.post-tile__published{color:var(--g-color-gray-500);font-size:1.4rem;line-height:1}}
