.blog-article{--accent: #14905a;--accent-strong: #075438;--wash: #eef7f2;--ink: #07110e;--muted: #52615c;min-height:100dvh;padding:7.25rem 0 6rem;background:#fff;color:var(--ink);font-family:Inter,sans-serif}.blog-article[data-theme=blueprint]{--accent: #2878e2;--accent-strong: #164b91;--wash: #edf5ff}.blog-article[data-theme=coral]{--accent: #df6948;--accent-strong: #963719;--wash: #fff1ec}.blog-article[data-theme=amber]{--accent: #be7921;--accent-strong: #78440d;--wash: #fff5e4}.blog-article[data-theme=violet]{--accent: #765bd0;--accent-strong: #483194;--wash: #f2effd}.article-shell{width:min(100% - 2rem,76rem);margin:0 auto}.back-link{display:inline-flex;gap:.5rem;align-items:center;color:#5c6d67;font-size:.78rem;font-weight:780;text-decoration:none}.back-link:hover{color:var(--accent-strong)}.back-link:focus-visible,.story a:focus-visible,.story-outline a:focus-visible{border-radius:.25rem;outline:3px solid color-mix(in srgb,var(--accent) 30%,transparent);outline-offset:4px}.story-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(23rem,.86fr);gap:clamp(2.5rem,6vw,6rem);align-items:center;margin:4rem 0 5.5rem}.story-heading h1{margin:1.25rem 0 0;font-family:Playfair Display,Georgia,serif;font-size:clamp(3.2rem,6.4vw,6.3rem);font-weight:700;letter-spacing:-.057em;line-height:.96;text-wrap:balance}.story-meta{display:flex;flex-wrap:wrap;gap:.55rem;align-items:center;color:#75817d;font-size:.72rem;font-weight:680}.story-meta>span:first-child{border-radius:999px;background:var(--wash);padding:.42rem .66rem;color:var(--accent-strong);font-size:.64rem;font-weight:850;letter-spacing:.07em;text-transform:uppercase}.dek{max-width:41rem;margin:1.45rem 0 0;color:var(--muted);font-family:Playfair Display,Georgia,serif;font-size:clamp(1.18rem,2vw,1.42rem);line-height:1.65}.byline{margin:1.25rem 0 0;color:#75817d;font-size:.74rem;font-weight:720}.blog-article[data-layout=stacked] .story-header{grid-template-columns:minmax(0,1fr);gap:2.5rem}.blog-article[data-layout=stacked] .story-heading{max-width:59rem}.blog-article[data-layout=stacked] .story-heading h1{max-width:12ch}.blog-article[data-layout=stacked] .story-header>:last-child{width:min(100%,58rem);margin-left:auto}.blog-article[data-layout=visual-left] .story-header{grid-template-columns:minmax(22rem,.9fr) minmax(0,1.1fr)}.blog-article[data-layout=visual-left] .story-heading{order:2}.blog-article[data-layout=visual-left] .story-header>:last-child{order:1}.blog-article[data-layout=wide-copy] .story-header{grid-template-columns:minmax(0,.82fr) minmax(25rem,1.18fr);align-items:end}.blog-article[data-layout=wide-copy] .story-heading h1{font-size:clamp(3.2rem,7vw,7rem)}.blog-article[data-layout=text-forward] .story-header{grid-template-columns:minmax(0,1.32fr) minmax(20rem,.68fr);gap:clamp(2.5rem,5vw,4.75rem)}.blog-article[data-layout=journal] .story-header{grid-template-columns:minmax(0,1.15fr) minmax(18rem,.65fr)}.blog-article[data-layout=journal] .story-heading{border-left:3px solid var(--accent);padding-left:clamp(1.25rem,3vw,2.5rem)}.blog-article[data-layout=journal] .story-heading h1{font-size:clamp(3rem,5.7vw,5.5rem)}.story-layout{display:grid;grid-template-columns:12.5rem minmax(0,46rem);gap:clamp(3rem,7vw,7rem);justify-content:center;align-items:start}.story-outline{position:sticky;top:7rem;border-top:2px solid var(--accent);padding-top:1rem}.story-outline>p{margin:0 0 .8rem;color:var(--accent-strong);font-size:.68rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.story-outline ol{display:grid;gap:.68rem;margin:0;padding:0;list-style:none}.story-outline a{display:grid;grid-template-columns:1.55rem 1fr;color:#60706a;font-size:.71rem;font-weight:670;line-height:1.4;text-decoration:none}.story-outline a:hover{color:var(--ink)}.story-outline a span{color:var(--accent);font:700 .62rem/1.55 ui-monospace,monospace}.story{min-width:0}.story>p,.story section>p,.story li{color:#2f403a;font-family:Playfair Display,Georgia,serif;font-size:1.15rem;line-height:1.88}.story>p{margin:0 0 1.45rem}.story .drop-cap:first-letter{float:left;margin:.09em .13em 0 0;color:var(--accent-strong);font-family:Playfair Display,Georgia,serif;font-size:4.4rem;font-weight:700;line-height:.75}.story section{scroll-margin-top:7rem;margin-top:4.8rem}.story section>.section-number{margin:0 0 .7rem;color:var(--accent);font:780 .68rem/1 ui-monospace,monospace;letter-spacing:.12em}.story h2{margin:0 0 1.4rem;font-family:Playfair Display,Georgia,serif;font-size:clamp(2.2rem,4.5vw,3.6rem);font-weight:690;letter-spacing:-.04em;line-height:1.03;text-wrap:balance}.story h3{margin:0;font-size:1rem;line-height:1.25}.story a{color:var(--accent-strong);text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent);text-underline-offset:.18em}.story code{border-radius:.28rem;background:var(--wash);padding:.12rem .34rem;color:var(--accent-strong);font:.85em/1.4 ui-monospace,SFMono-Regular,Menlo,monospace}.story .pullquote{margin:3.2rem 0;border-block:1px solid color-mix(in srgb,var(--accent) 28%,#dce3df);padding:2.2rem 0;color:var(--accent-strong);font-family:Playfair Display,Georgia,serif;font-size:clamp(1.75rem,3.8vw,2.65rem);font-style:italic;letter-spacing:-.025em;line-height:1.22}.story .callout{margin:2.5rem 0;border-left:4px solid var(--accent);border-radius:0 1rem 1rem 0;background:var(--wash);padding:1.4rem 1.55rem}.story .callout h3{color:var(--accent-strong)}.story .callout p{margin:.65rem 0 0;color:#40514b;font-family:Inter,sans-serif;font-size:.9rem;line-height:1.65}.story .story-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:2.5rem 0}.story .story-card{border:1px solid #dce5e1;border-radius:1rem;background:#fff;padding:1.25rem}.story .story-card strong{display:block;color:var(--accent-strong);font-size:.97rem}.story .story-card p{margin:.55rem 0 0;color:#5a6964;font-size:.82rem;line-height:1.6}.story .metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin:2.5rem 0}.story .metric{border-radius:1rem;background:var(--ink);padding:1.25rem;color:#fff}.story .metric strong{display:block;color:#fff;font-family:Playfair Display,Georgia,serif;font-size:2rem;line-height:1}.story .metric span{display:block;margin-top:.55rem;color:#aabbb5;font-size:.7rem;line-height:1.45}.story .diagram{margin:2.6rem 0;border:1px solid #d8e2de;border-radius:1.2rem;background:#f9fbfa;padding:1.3rem}.story .diagram-title{margin:0 0 1rem;color:#77847f;font-size:.65rem;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.story .flow{display:flex;gap:.55rem;align-items:stretch}.story .flow>div{flex:1;border-radius:.72rem;background:#fff;padding:.9rem;box-shadow:0 0 0 1px #dfe7e3}.story .flow b{display:block;color:var(--accent-strong);font-size:.78rem}.story .flow small{display:block;margin-top:.42rem;color:#65736e;font-size:.67rem;line-height:1.45}.story .flow>span{align-self:center;color:var(--accent);font-weight:800}.story .compare{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;margin:2.7rem 0}.story .compare>div{overflow:hidden;border:1px solid #dbe4e0;border-radius:1rem}.story .compare h3{background:var(--wash);padding:1rem 1.1rem;color:var(--accent-strong)}.story .compare ul{margin:0;padding:1rem 1.2rem 1.2rem 2.2rem}.story .compare li{margin:.4rem 0;font-family:Inter,sans-serif;font-size:.79rem;line-height:1.55}.story .code-panel{overflow:auto;margin:2.5rem 0;border-radius:1rem;background:#081712;padding:1.4rem;color:#c9f5dd}.story .code-panel pre{margin:0;white-space:pre-wrap}.story .code-panel code{background:transparent;padding:0;color:inherit;font-size:.76rem;line-height:1.72}.story .closing-note{margin-top:5rem;border-radius:1.25rem;background:var(--ink);padding:2rem;color:#fff}.story .closing-note p{margin:0;color:#b8c8c2;font-family:Inter,sans-serif;font-size:.86rem;line-height:1.65}.story .closing-note a{display:inline-flex;margin-top:1rem;color:#c9f5dd;font-size:.78rem;font-weight:800;text-decoration:none}@media (max-width: 900px){.story-header,.blog-article[data-layout=visual-left] .story-header,.blog-article[data-layout=wide-copy] .story-header,.blog-article[data-layout=text-forward] .story-header,.blog-article[data-layout=journal] .story-header{grid-template-columns:1fr}.blog-article[data-layout=visual-left] .story-heading,.blog-article[data-layout=visual-left] .story-header>:last-child{order:initial}.story-layout{grid-template-columns:1fr}.story-outline{position:static;display:none}}@media (max-width: 620px){.blog-article{padding-top:6.25rem}.story-header{margin-top:3rem}.story .story-grid,.story .metric-row,.story .compare{grid-template-columns:1fr}.story .flow{flex-direction:column}.story .flow>span{transform:rotate(90deg)}}
