@layer components{.hfr-blog-layout{grid-template-rows:auto auto;grid-template-columns:minmax(12rem,20rem) minmax(0,1fr);gap:1.5em 2.5em;display:grid}.hfr-blog-layout[aria-busy=true]{pointer-events:none;opacity:.72}.hfr-blog-layout>h1,.hfr-blog-filters>h2{align-items:flex-end;display:flex}.hfr-blog-layout>h1{grid-area:1/2}.hfr-blog-filters{grid-area:1/1/span 2;grid-template-rows:subgrid;row-gap:1.5em;min-width:0;display:grid}.hfr-blog-filters>h2{grid-row:1}.hfr-blog-filters>ul{grid-row:2}.hfr-blog-main{grid-area:2/2;min-width:0}.hfr-blog-filters ul,.hfr-blog-pages ol,.hfr-blog-hero-meta,.hfr-blog-share{margin:0;padding:0;list-style:none}.hfr-blog-filters ul{align-content:start;gap:.7em;display:grid}.hfr-blog-filters a{color:inherit;transition:transform var(--hfr-motion) var(--hfr-motion-ease);align-items:center;gap:.7em;padding:.15rem 0;text-decoration:none;display:flex}.hfr-blog-filters a:hover,.hfr-blog-filters a:focus-visible{transform:translate(.3rem)}.hfr-blog-filters a:before{content:"";border-radius:var(--hfr-radius-sm);background:0 0;border:1px solid;flex:none;width:.9em;height:.9em}.hfr-blog-filters a[aria-current=page]:before{box-shadow:inset 0 0 0 .2em var(--hfr-canvas);background:currentColor}.hfr-blog-pages{flex-wrap:wrap;justify-content:center;align-items:center;gap:.5em;margin-top:1.5em;display:flex}.hfr-blog-pages ol{flex-wrap:wrap;justify-content:center;gap:.5em;display:flex}.hfr-blog-pages a{border-radius:var(--hfr-radius-sm);min-width:2.5rem;height:2.5rem;color:inherit;justify-content:center;align-items:center;text-decoration:none;display:inline-flex}.hfr-blog-pages a:hover,.hfr-blog-pages a:focus-visible{background:color-mix(in srgb, var(--hfr-brand) 18%, transparent)}.hfr-blog-pages a[aria-current=page]{background:var(--hfr-brand);color:var(--hfr-on-brand)}.hfr-blog-post{--hfr-blog-gutter:2.5em;flex-direction:column;gap:1.5em;display:flex}.hfr-blog-hero{width:calc(100% + (2 * var(--hfr-site-gutter)));max-width:none;min-height:31.25rem;margin-inline:calc(-1 * var(--hfr-site-gutter));color:var(--hfr-on-nav);background:var(--hfr-nav);box-shadow:0 2px 0 color-mix(in srgb, var(--hfr-ink) 35%, transparent);align-items:center;display:flex;position:relative;overflow:hidden}.hfr-page:has(>.hfr-blog-post>.hfr-blog-hero){padding-block-start:0}.hfr-blog-hero-media picture{width:100%;height:100%;display:block}.hfr-blog-hero-media,.hfr-blog-hero-scrim{position:absolute;inset:0}.hfr-blog-hero-media{z-index:0;display:grid;overflow:hidden}.hfr-blog-hero-media .hfr-blog-placeholder{min-height:0;color:color-mix(in srgb, var(--hfr-on-nav) 70%, var(--hfr-brand))}.hfr-blog-hero-scrim{z-index:1;pointer-events:none;background:linear-gradient(90deg,#000 0%,#0000006b 48%,#0000 74%)}.hfr-blog-hero-copy{z-index:2;min-width:0;max-width:50%;padding:2.5rem var(--hfr-blog-gutter);flex-direction:column;align-items:flex-start;gap:.5em;display:flex;position:relative}.hfr-blog-hero-copy h1,.hfr-blog-lede{color:var(--hfr-on-nav);margin:0}.hfr-blog-lede{color:color-mix(in srgb, var(--hfr-on-nav) 86%, transparent)}.hfr-blog-hero-meta{border-radius:var(--hfr-radius-md);background:var(--hfr-surface);max-width:fit-content;color:var(--hfr-fg);flex-wrap:wrap;align-items:center;gap:1.25rem 2.5em;margin-top:.5em;padding:.5em 1em;display:flex}.hfr-blog-hero-meta li{align-items:center;gap:.5em;display:flex}.hfr-blog-hero-meta .hfr-icon{opacity:.7;flex:none;width:.8rem;height:.8rem}.hfr-blog-post-layout,.hfr-blog-post-faq{padding-inline:var(--hfr-blog-gutter)}.hfr-blog-post-layout{grid-template-columns:minmax(0,1fr) minmax(15.625rem,16rem);align-items:start;gap:2.5em;display:grid}.hfr-blog-aside{flex-direction:column;gap:1.5em;min-width:0;display:flex;position:sticky;top:4.75rem}.hfr-blog-aside section{flex-direction:column;gap:.75em;display:flex}.hfr-blog-toc{border-radius:var(--hfr-radius-sm);background:color-mix(in srgb, var(--hfr-surface) 88%, var(--hfr-line));padding:.95rem 1rem}.hfr-blog-toc-head{border-bottom:1px solid var(--hfr-line);justify-content:space-between;align-items:center;gap:.75rem;margin:0 0 .65rem;padding-bottom:.65rem;display:flex}.hfr-blog-toc-head h2{margin:0}.hfr-blog-toc-toggle{color:var(--hfr-fg-muted);cursor:pointer;font:inherit;font-size:var(--hfr-text-body-3);white-space:nowrap;background:0 0;border:0;flex:none;margin:0;padding:0}.hfr-blog-toc-toggle:hover,.hfr-blog-toc-toggle:focus-visible{color:var(--hfr-brand);text-decoration:underline}.hfr-blog-toc ol{gap:.35rem;margin:0;padding:0;list-style:none;display:grid}.hfr-blog-toc a,.hfr-blog-related a{color:var(--hfr-brand);text-decoration:none}.hfr-blog-toc a:hover,.hfr-blog-related a:hover,.hfr-blog-toc a:focus-visible,.hfr-blog-related a:focus-visible{text-decoration:underline}.hfr-blog-prose :is(h2,h3,h4){scroll-margin-top:var(--hfr-blog-jump,5.5rem)}.hfr-blog-prose :is(h2,h3,h4).is-hash-target{border-radius:var(--hfr-radius-sm);box-shadow:0 0 0 .45rem color-mix(in srgb, var(--hfr-brand) 22%, transparent)}.hfr-blog-attribution{border-top:1px solid color-mix(in srgb, var(--hfr-fg) 18%, transparent);color:var(--hfr-fg-muted);flex-direction:column;gap:.35rem;margin:0;padding-top:1.25rem;display:flex}.hfr-blog-attribution p{margin:0}.hfr-blog-attribution a{color:inherit;text-underline-offset:.15em;font-weight:600}.hfr-blog-share{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.hfr-blog-share-btn{border-radius:var(--hfr-radius-sm);width:2rem;height:2rem;color:var(--hfr-fg);opacity:.7;place-items:center;text-decoration:none;display:grid}.hfr-blog-share-btn:hover,.hfr-blog-share-btn:focus-visible{color:var(--hfr-brand);opacity:1}.hfr-blog-share-btn .hfr-icon,.hfr-blog-share-btn span[aria-hidden]{width:1rem;height:1rem}.hfr-blog-share-btn span[aria-hidden]{place-items:center;font-size:.75rem;font-weight:700;line-height:1;display:grid}.hfr-blog-related{gap:.5em;margin:0;padding-inline-start:1em;list-style:outside;display:grid}@media (width<=52rem){.hfr-blog-layout{grid-template-rows:none;grid-template-columns:1fr}.hfr-blog-layout>h1,.hfr-blog-filters,.hfr-blog-main{grid-area:auto/1}.hfr-blog-filters{flex-direction:column;display:flex}.hfr-blog-filters ul{grid-template-columns:repeat(auto-fill,minmax(10rem,1fr))}.hfr-blog-post{--hfr-blog-gutter:1.25rem}.hfr-blog-hero{align-items:flex-end;min-height:0}.hfr-blog-hero-copy{max-width:100%;padding-block:3.25rem 1.5rem}.hfr-blog-hero-meta{gap:.75rem 1.25rem}.hfr-blog-post-layout{grid-template-columns:1fr}.hfr-blog-aside{position:static}}@media (prefers-reduced-motion:reduce){.hfr-blog-filters a{transition:none;transform:none}}}
