.blog-page::before{height:460px;opacity:.45}
.blog-intro,.blog-library,.article-heading,.article-layout,.related-articles{width:min(1200px,100%);margin-inline:auto;padding-inline:32px}
.blog-intro{padding-top:64px;padding-bottom:44px}.blog-page .language-switch{width:max-content;margin-bottom:32px}.blog-intro h1{font-size:clamp(52px,7vw,82px);font-weight:400;line-height:1.05;letter-spacing:-.055em;margin:0 0 24px}.blog-intro h1 span{color:var(--green)}.blog-lead{font-size:clamp(24px,3vw,34px);line-height:1.35;letter-spacing:-.025em;max-width:750px;margin:0 0 18px}.blog-sub{font-size:18px;color:var(--muted);max-width:650px;margin:0}
.blog-library{padding-bottom:100px}.blog-tools{display:flex;justify-content:space-between;align-items:end;gap:24px;border-bottom:1px solid var(--line);padding:24px 0}.blog-tools label{display:grid;gap:8px;font-size:14px;color:var(--muted)}.blog-tools input,.blog-tools select{font:inherit;color:var(--ink);background:#f5f6f6;border:1px solid var(--line);border-radius:5px;padding:12px 14px;min-height:46px}.blog-search{width:min(360px,100%)}.blog-tools input:focus-visible,.blog-tools select:focus-visible{outline:2px solid var(--green);outline-offset:3px}.blog-count{font-size:14px;color:var(--muted);margin:24px 0}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.blog-card{background:var(--soft);border:1px solid var(--line);border-radius:9px;padding:28px;display:flex;flex-direction:column;min-height:350px;transition:border-color .18s,background .18s}.blog-card:hover{border-color:#aebca3;background:#f1f4ee}.card-meta,.card-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px;color:var(--muted)}.blog-tag{color:var(--green);font-weight:500}.blog-card h2{font-size:25px;font-weight:400;letter-spacing:-.035em;line-height:1.22;margin:30px 0 16px}.blog-card p{font-size:17px;line-height:1.6;color:var(--muted);margin:0 0 32px}.card-bottom{margin-top:auto;flex-wrap:wrap}.card-bottom a{color:var(--ink);text-decoration:underline;text-underline-offset:5px}.blog-page .nav a[aria-current]{color:var(--green)}
.article-heading{padding-top:48px;padding-bottom:56px}.breadcrumbs{display:flex;flex-wrap:wrap;gap:12px;font-size:14px;color:var(--muted);margin-bottom:40px}.article-heading h1{font-size:clamp(36px,4.8vw,64px);font-weight:400;line-height:1.12;letter-spacing:-.045em;max-width:980px;margin:0 0 24px}.article-intro{max-width:850px;color:var(--muted);font-size:22px;line-height:1.55;margin:0 0 28px}.article-meta{display:flex;flex-wrap:wrap;gap:12px 24px;font-size:14px;color:var(--muted)}.article-meta a{color:var(--green)}.article-layout{display:grid;grid-template-columns:245px minmax(0,740px);justify-content:space-between;gap:64px;padding-bottom:80px}.article-aside nav{position:sticky;top:130px;border-top:1px solid var(--line);padding-top:20px}.article-aside h2{font-size:14px;font-weight:500;margin:0 0 16px}.article-aside ol{margin:0;padding-left:20px}.article-aside li{font-size:14px;line-height:1.5;color:var(--muted);margin:0 0 12px;padding-left:4px}.article-content{min-width:0}.article-content h2{font-size:29px;line-height:1.25;font-weight:500;letter-spacing:-.025em;margin:46px 0 20px;scroll-margin-top:130px}.article-content>h2:first-child{margin-top:0}.article-content p,.article-content li{font-size:18px;line-height:1.8}.article-content p{margin:0 0 22px}.article-content ul{padding-left:24px;margin:20px 0 28px}.article-content li{margin-bottom:10px}.article-content a:not(.btn){text-decoration:underline;text-underline-offset:4px;color:var(--green)}.article-sources{border-top:1px solid var(--line);margin-top:48px}.article-sources p,.article-sources li{font-size:15px;overflow-wrap:anywhere}.article-contact{background:#f3f7ef;border:1px solid #dce4d5;border-radius:9px;padding:32px;margin-top:40px}.article-contact h2{margin-top:0}.related-articles{padding-block:60px 100px;border-top:1px solid var(--line)}.back-blogs{display:inline-block;margin-top:28px;text-decoration:underline;text-underline-offset:5px}
@media(max-width:1000px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.article-layout{grid-template-columns:200px minmax(0,1fr);gap:36px}.article-heading h1{max-width:850px}}
@media(max-width:800px){.blog-intro,.blog-library,.article-heading,.article-layout,.related-articles{padding-inline:28px}.blog-intro{padding-top:40px}.article-layout{display:block;padding-bottom:60px}.article-aside{margin-bottom:40px}.article-aside nav{position:static}.article-aside ol{columns:2;column-gap:30px}.article-aside li{break-inside:avoid}.article-heading{padding-block:36px 40px}.article-intro{font-size:20px}.blog-library{padding-bottom:70px}}
@media(max-width:520px){.blog-intro,.blog-library,.article-heading,.article-layout,.related-articles{padding-inline:22px}.blog-grid{grid-template-columns:1fr}.blog-tools{align-items:stretch;flex-direction:column;gap:16px}.blog-search{width:100%}.blog-card{min-height:300px;padding:24px}.blog-card h2{font-size:25px}.article-aside ol{columns:1}.article-content h2{font-size:26px}.article-content p,.article-content li{font-size:17px}.article-contact{padding:24px}.article-meta{gap:10px 18px}.related-articles{padding-block:48px 60px}.blog-page .site-header{gap:8px}}
@media(prefers-reduced-motion:reduce){.blog-card{transition:none}}

/* The article title link covers the whole card, including keyboard focus. */
.blog-card{position:relative}
.blog-card h2 a::after{content:"";position:absolute;inset:0;border-radius:9px}
.blog-card h2 a:focus-visible{outline:none}
.blog-card h2 a:focus-visible::after{outline:2px solid var(--green);outline-offset:4px}
.card-read{color:var(--ink);text-decoration:underline;text-underline-offset:5px}