/* Editorial product selections: opt-in, no changes to other articles. */
.ms-post-shell:has(.ms-plugin-guide){width:min(100%,1200px);padding-inline:clamp(24px,4vw,56px)}
.ms-post-shell:has(.ms-plugin-guide) .ms-post-cover{max-width:820px;margin-inline:auto}
.ms-post-shell:has(.ms-plugin-guide) .ms-post-cover img{object-fit:contain;background:#fff}
.ms-plugin-prose{max-width:760px;margin-inline:auto}
.ms-plugin-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:clamp(28px,4vw,56px);padding-block:64px;border-bottom:1px solid #e5e5e0}
.ms-plugin-feature:nth-of-type(even)>figure{order:2}
.ms-plugin-guide .ms-plugin-feature figure{margin:60px 0 0;position:sticky;top:110px}
.ms-plugin-guide .ms-plugin-feature img{width:100%;height:auto;border:0;box-shadow:none;background:#fff;object-fit:contain}
.ms-plugin-guide .ms-plugin-feature h2{margin:0 0 20px;padding:0;border:0;font-size:clamp(27px,2.8vw,36px);line-height:1.2;letter-spacing:-.025em}
.ms-plugin-guide .ms-plugin-feature h2::before{display:none}
.ms-plugin-guide .ms-plugin-number{font-size:12px;font-weight:750;letter-spacing:.07em;text-transform:uppercase;color:#626b63;margin-bottom:12px}
.ms-plugin-feature p,.ms-plugin-feature li{font-size:17px;line-height:1.7}
.ms-plugin-feature ul{padding-left:20px;margin:20px 0}
.ms-plugin-guide .ms-plugin-note{padding:16px 18px;background:#f6f6f3;border:1px solid #e6e6e0;border-radius:10px;font-size:14px;line-height:1.65}
.ms-plugin-guide .ms-plugin-feature h2{margin-bottom:20px}
@media(max-width:800px){.ms-plugin-feature{grid-template-columns:1fr;gap:24px;padding-block:38px}.ms-plugin-feature:nth-of-type(even)>figure{order:0}.ms-plugin-guide .ms-plugin-feature figure{position:static;margin:0}.ms-plugin-guide .ms-plugin-feature img{max-width:560px}.ms-post-shell:has(.ms-plugin-guide){padding-inline:22px}}
/* Calm reading layout: only single blog posts. */
.ms-post-page { --ms-post-accent: #42634a; background: var(--ms-ivory); }
.ms-post-page > .ms-breadcrumbs { padding-block: 22px; }
.ms-post-hero { border-bottom: 3px solid #688b68; padding-block: 78px 84px; }
.ms-post-hero .ms-wrap { max-width: 980px; }
.ms-post-hero h1 { max-width: 920px; font: 800 clamp(44px, 4.8vw, 66px)/1.08 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; text-transform: none; letter-spacing: -.035em; }
.ms-post-hero .ms-post-deck { max-width: 770px; font: 400 20px/1.55 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; color: #e4e4e7; }
.ms-post-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 27px; color: #c7c7ca; font: 700 12px/1.4 Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.ms-post-author-link { display: inline-flex; align-items: center; gap: 10px; color: var(--ms-lime); text-decoration: none; }
.ms-post-author-link:hover { color: #fff; }
.ms-post-author-link:focus-visible { outline: 2px solid var(--ms-lime); outline-offset: 4px; }
.ms-post-author-link img { width: 42px; height: 42px; border: 2px solid #626262; border-radius: 50%; background: #fff; object-fit: cover; object-position: center 25%; }

.ms-post-surface { padding: 64px 24px 34px; }
.ms-post-shell { width: min(100%, 860px); margin-inline: auto; padding: 0 clamp(25px, 5vw, 70px); background: #fff; border: 1px solid var(--ms-card-border); border-radius: var(--ms-card-radius); box-shadow: var(--ms-card-shadow); overflow: hidden; }
.ms-post-cover { margin: 42px 0 0; }
.ms-post-cover img { display: block; width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; background: #151515; }
.ms-post-toc[hidden] { display: none; }
.ms-post-toc { margin-top: 43px; border: 1px solid #dfe5dc; border-left: 4px solid var(--ms-post-accent); background: #f5f7f3; }
.ms-post-toc summary { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 20px 24px; cursor: pointer; list-style: none; }
.ms-post-toc summary::-webkit-details-marker { display: none; }
.ms-post-toc summary span { font: 750 16px/1.25 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; }
.ms-post-toc summary small { font: 700 11px/1.2 Arial, sans-serif; text-transform: uppercase; color: var(--ms-post-accent); white-space: nowrap; }
.ms-post-toc summary:focus-visible { outline: 3px solid var(--ms-post-accent); outline-offset: 2px; }
.ms-post-toc nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; padding: 0 24px 22px; }
.ms-post-toc nav a { display: block; border-top: 1px solid #dde4dc; padding: 11px 0; color: #304837; font: 600 13px/1.45 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; text-decoration: none; }
.ms-post-toc nav a:hover { text-decoration: underline; text-decoration-color: #6d8b72; text-underline-offset: 3px; }

.ms-post-content.ms-content { max-width: none; padding: 52px 0 76px; color: #292e2b; font: 400 18px/1.76 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; letter-spacing: -.005em; overflow-wrap: break-word; }
.ms-post-content > :first-child { margin-top: 0; }
.ms-post-content p { margin: 0 0 1.38em; }
.ms-post-content > p:first-of-type { color: #202521; font-size: 1.05em; line-height: 1.72; }
.ms-post-content h2, .ms-post-content h3, .ms-post-content h4 { color: #202622; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; text-transform: none; scroll-margin-top: 28px; }
.ms-post-content h2 { position: relative; margin: 2.2em 0 .7em; padding-top: .75em; border-top: 1px solid #dfe2dc; font-size: clamp(29px, 3.6vw, 36px); font-weight: 750; line-height: 1.2; letter-spacing: -.03em; }
.ms-post-content h2::before { position: absolute; top: -2px; left: 0; width: 54px; height: 3px; background: var(--ms-post-accent); content: ''; }
.ms-post-content h3 { margin: 1.8em 0 .6em; padding-left: 14px; border-left: 3px solid #8da58d; font-size: clamp(23px, 2.6vw, 27px); font-weight: 700; line-height: 1.25; letter-spacing: -.02em; }
.ms-post-content h4 { margin: 1.7em 0 .55em; font-size: 21px; font-weight: 700; line-height: 1.3; }
.ms-post-content strong { color: #111; }
.ms-post-content a { color: #28563a; text-decoration: underline; text-decoration-color: #789681; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.ms-post-content a:hover { color: #183a26; background: #edf2ec; }
.ms-post-content > ul, .ms-post-content > ol { margin: 29px 0 35px; padding: 21px 27px 21px 50px; border-left: 3px solid #8da58d; background: #f6f7f5; }
.ms-post-content li { padding-left: 5px; margin: .55em 0; }
.ms-post-content li::marker { color: var(--ms-post-accent); font-weight: 700; }
.ms-post-content blockquote { position: relative; margin: 42px 0; padding: 28px 32px; border-left: 4px solid var(--ms-post-accent); background: #f3f5f2; color: #26312a; font-size: 1.05em; line-height: 1.65; }
.ms-post-content blockquote p:last-child { margin-bottom: 0; }
.ms-post-content blockquote strong, .ms-post-content blockquote a { color: #28563a; }
.ms-post-content img { display: block; width: auto; max-width: 100%; height: auto; margin: 42px auto; border: 1px solid #e1e1dd; border-radius: 7px; box-shadow: 0 15px 35px #00000014; }
.ms-post-content figure { margin: 42px 0; }
.ms-post-content figure img { margin: 0 auto; }
.ms-post-content figcaption { margin-top: 12px; color: #6b6b67; font: 13px/1.5 Arial, sans-serif; text-align: center; }
.ms-post-content table { display: block; width: 100%; overflow-x: auto; margin: 38px 0; border: 1px solid #d5d5cf; border-collapse: collapse; font: 14px/1.5 Arial, sans-serif; }
.ms-post-content th { background: #151515; color: #fff; text-align: left; }
.ms-post-content td, .ms-post-content th { min-width: 150px; padding: 14px 16px; vertical-align: top; }
.ms-post-content tr:nth-child(even) td { background: #f6f7f5; }
.ms-post-content pre { overflow-x: auto; padding: 22px; background: #161616; color: #f7f7f7; font: 14px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; }
.ms-post-content :not(pre) > code { border-radius: 3px; padding: .12em .3em; background: #f0f1e8; font-size: .88em; }
.ms-post-content hr { height: 1px; margin: 50px 0; border: 0; background: #d9d9d4; }
.ms-post-author-card { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: var(--ms-card-gap); margin: 0 0 62px; padding: var(--ms-card-padding); border: 1px solid #343434; border-radius: var(--ms-card-radius); background: #1b1b1a; color: #fff; }
.ms-post-author-photo { width: 150px; height: 150px; background: #fff; object-fit: cover; object-position: center 25%; }
.ms-post-author-eyebrow { margin: 0 0 8px; color: var(--ms-lime); font: 800 11px/1.3 Arial, sans-serif; letter-spacing: .16em; text-transform: uppercase; }
.ms-post-author-card h2 { margin: 0; color: #fff; font: 900 32px/1.05 Arial, sans-serif; letter-spacing: -.03em; }
.ms-post-author-role { margin: 7px 0 15px; color: #b8b8b8; font: 700 11px/1.4 Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase; }
.ms-post-author-bio { max-width: 520px; margin: 0 0 18px; color: #e0e0e0; font: 16px/1.65 Georgia, serif; }
.ms-post-author-card a { color: var(--ms-lime); font: 800 12px/1.4 Arial, sans-serif; letter-spacing: .04em; text-decoration: underline; text-underline-offset: 4px; text-transform: uppercase; }
.ms-post-author-card a:hover { color: #fff; }
.ms-post-previous { border-top: 1px solid #d9ded7; padding-block: 42px 28px; }
.ms-post-previous-heading { margin-bottom: 28px; }
.ms-post-previous-heading h2 { margin: 8px 0 0; color: #202622; font: 750 clamp(30px, 3.5vw, 42px)/1.16 -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; letter-spacing: -.03em; }
.ms-post-page .ms-article-end { margin-bottom: 0; padding: 15px 0 80px; }

@media (max-width: 700px) {
  .ms-post-hero { padding-block: 58px 65px; }
  .ms-post-hero h1 { font-size: clamp(38px, 8vw, 50px); }
  .ms-post-hero .ms-post-deck { font-size: 18px; }
  .ms-post-surface { padding: 28px 15px 15px; }
  .ms-post-shell { padding: 0 23px; box-shadow: none; }
  .ms-post-cover { margin-top: 23px; }
  .ms-post-toc { margin-top: 28px; }
  .ms-post-toc summary { padding: 17px; }
  .ms-post-toc nav { grid-template-columns: 1fr; padding: 0 17px 14px; }
  .ms-post-content.ms-content { padding: 38px 0 50px; font-size: 17px; line-height: 1.73; }
  .ms-post-content h2 { margin-top: 2.1em; }
  .ms-post-content > ul, .ms-post-content > ol { padding: 19px 20px 19px 35px; }
  .ms-post-content blockquote { padding: 24px; }
  .ms-post-author-card { grid-template-columns: 1fr; gap: 18px; padding: 24px; margin-bottom: 40px; }
  .ms-post-author-photo { width: 110px; height: 110px; }
  .ms-post-author-card h2 { font-size: 28px; }
  .ms-post-previous { padding-block: 32px 22px; }
  .ms-post-page .ms-article-end { padding: 15px 15px 55px; }
}