.blog-header,.blog-footer{max-width:1160px}.blog-header{gap:16px}.blog-header nav{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px 24px;font-size:15px;font-weight:600;display:flex}.blog-main{max-width:1160px;padding:24px max(24px,env(safe-area-inset-right,0px)) 80px max(24px,env(safe-area-inset-left,0px));margin:auto}.blog-intro{max-width:800px;margin:32px 0 48px}.blog-eyebrow{color:var(--green);letter-spacing:.1em;text-transform:uppercase;font-size:14px;font-weight:600}.blog-main h1{letter-spacing:-.035em;text-wrap:balance;margin:16px 0 24px;font:600 clamp(2rem,1.4rem + 2.5vw,3.5rem)/1.1 Bricolage Grotesque,system-ui,sans-serif}.blog-intro>p:last-child{color:var(--lead);max-width:640px;font-size:20px}.blog-grid{grid-template-columns:1fr;gap:24px;display:grid}.blog-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;position:relative;overflow:hidden}.blog-image-link{display:block}.blog-card img{aspect-ratio:3/2;object-fit:cover;width:100%;height:auto;display:block}.blog-card-body{padding:24px}.blog-card h2{letter-spacing:-.02em;margin:16px 0;font:600 25px/1.2 Bricolage Grotesque,system-ui,sans-serif}.blog-card h2 a{color:var(--ink);text-decoration:none}.blog-card h2 a:hover{text-underline-offset:4px;text-decoration:underline}.blog-card h2 a:after{content:"";z-index:1;border-radius:16px;position:absolute;inset:0}.blog-card:has(h2 a:focus-visible){outline:3px solid var(--green);outline-offset:4px}.blog-card h2 a:focus-visible{outline:none}.blog-card p{color:var(--lead)}.blog-read{color:var(--green);margin-top:24px;font-weight:600;display:block}.blog-main .blog-meta{color:var(--muted);margin:8px 0;font-size:14px}.blog-article{max-width:808px;padding-top:32px}.blog-post-header{margin-bottom:40px}.blog-back{font-size:15px;font-weight:600}.blog-tags{flex-wrap:wrap;gap:8px;margin:24px 0;padding:0;list-style:none;display:flex}.blog-tags li{border:1px solid var(--border);color:var(--lead);border-radius:999px;padding:4px 12px;font-size:13px}.blog-hero{aspect-ratio:3/2;object-fit:cover;border-radius:16px;width:100%;height:auto;margin-top:24px;display:block}.blog-prose{color:var(--lead);overflow-wrap:anywhere}.blog-prose .lead{color:var(--ink);font-size:21px;line-height:1.65}.blog-prose h2,.blog-related h2{letter-spacing:-.02em;color:var(--ink);margin:48px 0 16px;font:600 28px/1.2 Bricolage Grotesque,system-ui,sans-serif}.blog-prose h3{color:var(--ink);margin-top:32px;font:600 22px/1.3 Bricolage Grotesque,system-ui,sans-serif}.blog-prose li,.blog-related li{margin-block:12px}.blog-prose :is(ul,ol),.blog-related ul{padding-left:24px}.blog-related{border-top:1px solid var(--border);margin-top:48px}.blog-cta{border:1px solid var(--border);background:var(--surface);border-radius:16px;margin-top:48px;padding:28px 24px}.blog-cta h2{letter-spacing:-.02em;color:var(--ink);margin:0 0 8px;font:600 26px/1.2 Bricolage Grotesque,system-ui,sans-serif}.blog-cta p{color:var(--lead);margin:0 0 20px}.blog-cta-actions{flex-wrap:wrap;gap:12px;display:flex}.blog-btn,.blog-btn2,.blog-hd-cta{text-align:center;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:999px;justify-content:center;align-items:center;min-height:48px;padding:0 22px;font-weight:600;line-height:1.25;text-decoration:none;transition:transform .14s cubic-bezier(.23,1,.32,1),background-color .2s;display:inline-flex}.blog-btn{background:var(--green);color:var(--bg)}.blog-btn2{border:1px solid var(--border);color:var(--ink)}.blog-hd-cta{border:1px solid var(--green);min-height:40px;color:var(--green);padding:0 16px}:is(.blog-btn,.blog-btn2,.blog-hd-cta):active{transform:scale(.97)}@media (hover:hover) and (pointer:fine){.blog-btn2:hover{border-color:var(--ink)}.blog-hd-cta:hover{background:color-mix(in srgb,var(--green) 10%,transparent)}}.blog-main a:focus-visible,.blog-header a:focus-visible,.blog-footer a:focus-visible{outline:3px solid var(--green);outline-offset:5px}@media (width>=1024px){.blog-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=480px){.blog-main{padding-inline:max(20px,env(safe-area-inset-left,0px)) max(20px,env(safe-area-inset-right,0px))}.blog-header nav{gap:16px}.blog-card-body{padding:20px}}
