/* Shared local blog preview styles. Edit tokens and article components here. */
@font-face{font-family:Inter;src:url('/assets/fonts/Inter-Latin.woff2') format('woff2');font-display:swap}@font-face{font-family:Nohemi;src:url('/assets/fonts/Nohemi-SemiBold.woff2') format('woff2');font-display:swap;font-weight:600}
:root{--ink:#19231d;--muted:#627167;--line:#e0e7df;--green:#226e49}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:#176a43;text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:#0d4f2d}a:focus-visible,button:focus-visible{outline:3px solid #89b3ef;outline-offset:3px}
.progress{position:fixed;z-index:10;top:0;left:0;height:3px;background:#2f8e58;width:0}.site-header{min-height:68px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:12px max(24px,calc((100vw - 1120px)/2));gap:18px}.brand{font:600 21px Nohemi,Inter,sans-serif;color:#193829;text-decoration:none;white-space:nowrap;letter-spacing:-.03em}.brand small{font:500 13px Inter,Arial,sans-serif;color:var(--muted);letter-spacing:0}.preview-link{font-size:13px;color:#53665a;text-decoration:none}.pill{display:inline-block;padding:7px 10px;border-radius:99px;border:1px solid #dbe5db;background:#f5f8f4;font-size:12px;color:#526b56;white-space:nowrap}
.article{width:min(620px,calc(100% - 40px));margin:0 auto}.head{padding:76px 0 36px}.kicker{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin:0 0 21px}h1,h2{font-family:Nohemi,Inter,sans-serif;font-weight:600;letter-spacing:-.035em}h1{font-size:clamp(40px,5.9vw,61px);line-height:1.08;margin:0 0 24px}.dek{font-size:20px;line-height:1.53;color:#516158;margin:0 0 28px}.byline{font-size:13px;color:var(--muted);line-height:1.6}.byline strong{color:var(--ink)}.rule{height:1px;background:var(--line);margin:4px 0 37px}.prose{font-size:18px;line-height:1.75;letter-spacing:-.012em}.prose p{margin:0 0 25px}.prose h2{font-size:30px;line-height:1.22;margin:53px 0 21px}.prose strong{font-weight:700}.prose blockquote{font:600 27px/1.37 Nohemi,Inter,sans-serif;letter-spacing:-.025em;color:#205d3d;margin:39px -15px 16px;padding-left:20px;border-left:4px solid #a6d6a8}.prose p:first-child:first-letter{float:left;font:600 76px/.78 Nohemi,Inter,sans-serif;padding:10px 10px 0 0;color:#1c6342}.wide{width:min(1040px,calc(100vw - 40px));position:relative;left:50%;transform:translateX(-50%);margin:42px 0 42px}.image-frame{background:#f6f8f5;padding:10px;border:1px solid var(--line);border-radius:17px;box-shadow:0 18px 45px rgba(22,55,29,.06)}.wide img{display:block;width:100%;height:auto;border-radius:10px}figcaption{max-width:850px;font-size:13px;line-height:1.55;color:var(--muted);text-align:center;margin:12px auto 0}.editor-note{font-size:13px;line-height:1.6;color:#647369;background:#f6f8f5;border-left:3px solid #b5d7bc;padding:14px 18px;margin:47px 0 0}.source-box{border-top:1px solid var(--line);margin:50px 0 65px;padding-top:28px}.source-box h2{font-size:21px;margin:0 0 14px}.source-box ul{padding-left:19px;margin:0}.source-box li{font-size:13px;line-height:1.6;padding:5px 0;overflow-wrap:anywhere}.source-box span{color:#829086;margin-left:4px}footer{border-top:1px solid var(--line);padding:24px 20px 45px;text-align:center;font-size:13px;color:var(--muted)}@media(max-width:650px){.site-header{min-height:60px;padding:10px 20px}.preview-link{display:none}.head{padding:48px 0 25px}.dek{font-size:18px}.prose{font-size:17px;line-height:1.7}.prose h2{font-size:26px}.prose blockquote{font-size:23px;margin-left:0;margin-right:0}figcaption{text-align:left}.wide{margin:31px 0}.image-frame{padding:5px;border-radius:11px}}

/* Shared PaperMantis blog layout. The Markdown is content;
this is the visual template. */
:root {
  --ink:#161a1d;
  --muted:#61686c;
  --line:#ececef;
  --green:#3478f6
}
body {
  color:var(--ink)
}
.skip-link {
  position:absolute;
  left:12px;
  top:-60px;
  z-index:40;
  background:#fff;
  padding:10px 14px;
  border:2px solid #3478f6;
  border-radius:8px
}
.skip-link:focus {
  top:10px
}
.blog-article .prose p:first-child:first-letter {
  float:none;
  font:inherit;
  padding:0;
  color:inherit
}
.blog-index .site-header,.blog-article .site-header {
  min-height:70px;
  padding:0 24px;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line)
}
.header-inner {
  width:min(1240px,100%);
  min-height:70px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.brand-group {
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0
}
.brand {
  display:flex;
  align-items:center;
  flex:none
}
.brand img {
  display:block;
  width:172px;
  height:auto
}
.blog-word {
  color:#535b5d;
  font:500 14px Inter,Arial,sans-serif;
  text-decoration:none
}
.blog-word:hover {
  color:var(--ink)
}
.index-nav {
  display:flex;
  align-items:center;
  gap:32px;
  flex:none
}
.index-nav a {
  color:#535b5d;
  font:500 14px Nohemi,Inter,sans-serif;
  text-decoration:none;
  white-space:nowrap
}
.index-nav a:hover {
  color:var(--ink)
}
.blog-footer {
  border-top:1px solid var(--line);
  padding:28px 24px 36px;
  text-align:left;
  background:#fff
}
.blog-footer-inner {
  width:min(1240px,100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:20px
}
.footer-brand {
  display:inline-flex;
  align-items:center;
  gap:9px;
  width:max-content;
  color:var(--ink);
  font:600 16px Nohemi,Inter,sans-serif;
  text-decoration:none
}
.footer-brand img {
  display:block;
  width:28px;
  height:28px
}
.footer-links {
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 26px
}
.footer-links a {
  color:#61686c;
  font-size:13px;
  text-decoration:none
}
.footer-links a:hover {
  color:var(--ink)
}
.footer-note {
  grid-column:1/-1;
  margin-top:2px;
  color:#9a9c9e;
  font-size:12px
}
.index-wrap {
  width:min(1240px,calc(100% - 48px));
  margin:0 auto;
  padding:40px 0 100px
}
.index-eyebrow {
  margin:0 0 17px;
  color:#60686b;
  font-size:12px;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase
}
.blog-index h1,.card-title {
  font-family:Nohemi,Inter,sans-serif;
  font-weight:600;
  letter-spacing:-.035em
}
.blog-index h1 {
  max-width:850px;
  margin:0 0 10px;
  font-size:clamp(42px,5vw,58px);
  line-height:1.07
}
.index-intro {
  max-width:595px;
  margin:0 0 38px;
  color:#61686c;
  font-size:17px;
  line-height:1.65
}
.article-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:32px;
  row-gap:46px
}
.article-card {
  min-width:0
}
.card-link {
  display:flex;
  flex-direction:column;
  height:100%;
  color:inherit;
  text-decoration:none
}
.card-image {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:20px;
  background:#f5f5f7
}
.card-image img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain
}
.card-image.art-cover img {
  object-fit:cover
}
.card-copy {
  display:flex;
  flex:1;
  flex-direction:column;
  padding-top:18px
}
.card-title {
  font-size:20px;
  line-height:1.23;
  color:var(--ink)
}
.card-dek {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  margin-top:8px;
  color:#61686c;
  font-size:14px;
  line-height:1.58
}
.card-meta {
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  column-gap:7px;
  row-gap:0;
  margin-top:auto;
  padding-top:12px;
  color:#72797c;
  font-size:13px;
  line-height:1.6
}
.card-link:hover .card-title {
  color:#3a454a
}
.card-link:hover .card-image {
  filter:brightness(.975)
}
.card-link:focus-visible {
  outline:3px solid #3478f6;
  outline-offset:6px;
  border-radius:8px
}
.blog-article .article {
  width:min(620px,calc(100% - 40px))
}
.blog-article .head {
  padding:37px 0 31px
}
.article-back {
  display:inline-block;
  margin:0 0 41px;
  color:#61686c;
  font-size:14px;
  font-weight:500;
  text-decoration:none
}
.article-back:hover {
  color:var(--ink)
}
.blog-article .kicker {
  margin:0 0 18px;
  color:#61686c;
  font-size:12px;
  font-weight:700;
  letter-spacing:.07em
}
.blog-article h1 {
  margin:0 0 18px;
  color:var(--ink);
  font-size:clamp(38px,4.7vw,55px);
  line-height:1.11
}
.blog-article .dek {
  margin:0 0 24px;
  color:#61686c;
  font-size:19px;
  line-height:1.55
}
.blog-article .byline {
  color:#72797c;
  font-size:13px
}
.blog-article .byline strong {
  color:var(--ink)
}
.blog-article .rule {
  background:var(--line);
  margin:0 0 39px
}
.blog-article .prose {
  color:#252c30;
  font-size:18px;
  line-height:1.74
}
.blog-article .prose h2 {
  color:var(--ink);
  font-size:30px
}
.blog-article .prose a {
  color:#0b67d8
}
.blog-article .prose a:hover {
  color:#15191b
}
.blog-article .prose blockquote {
  color:var(--ink);
  border-left:3px solid #d4dadd;
  font-size:25px
}
.blog-article .article-list {
  margin:4px 0 32px;
  padding-left:24px
}
.blog-article .article-list li {
  padding-left:5px;
  margin:0 0 12px
}
.blog-article .editorial-block {
  margin:38px 0;
  padding:22px 25px 2px;
  border:0;
  border-radius:15px;
  background:#f6f9f5
}
.blog-article .editorial-block.editorial-note {
  background:#f7f7f6
}
.blog-article .editorial-block.editorial-check {
  background:#f8f7f2
}
.blog-article .editorial-label {
  display:block;
  margin-bottom:9px;
  font-size:12px;
  line-height:1.4;
  font-weight:700;
  letter-spacing:.035em;
  text-transform:uppercase;
  color:#51745b
}
.blog-article .editorial-check .editorial-label {
  color:#876a36
}
.blog-article .reaction-figure {
  width:min(540px,100%);
  margin:40px auto;
  text-align:center
}
.blog-article .reaction-figure img {
  display:block;
  width:100%;
  height:auto;
  border-radius:13px;
  background:#f4f4f4
}
.blog-article .wide {
  width:min(900px,calc(100vw - 40px))
}
.blog-article .image-frame {
  padding:0;
  border:0;
  border-radius:16px;
  background:#f5f5f7;
  box-shadow:none;
  overflow:hidden
}
.blog-article .wide img {
  border-radius:0
}
.blog-article figcaption {
  max-width:620px;
  color:#82888b;
  font-size:12px;
  line-height:1.5
}
.blog-article .source-box {
  border-top:1px solid var(--line)
}
.blog-article .source-box h2 {
  color:var(--ink);
  font-size:23px;
  line-height:1.3
}
.blog-article .source-box li {
  font-size:15px;
  line-height:1.65;
  padding:7px 0
}
.blog-article .source-box span {
  font-size:14px
}
.blog-article .source-box a {
  color:#0b67d8
}
.blog-article .source-box a:hover {
  color:#15191b
}
@media(max-width:900px) {
  .article-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:650px) {
  .blog-index .site-header,.blog-article .site-header {
    padding:0 18px
  }
  .header-inner {
    min-height:62px;
    gap:12px
  }
  .brand-group {
    gap:8px
  }
  .brand img {
    width:123px
  }
  .blog-word {
    font-size:12px
  }
  .index-nav {
    gap:0
  }
  .index-nav>a:first-child {
    display:none
  }
  .index-nav .nav-cta {
    min-height:36px;
    padding:0 12px;
    font-size:12px
  }
  .index-wrap {
    width:calc(100% - 36px);
    padding:48px 0 78px
  }
  .blog-index h1 {
    font-size:42px
  }
  .index-intro {
    font-size:16px;
    margin-bottom:30px
  }
  .article-grid {
    grid-template-columns:1fr;
    row-gap:37px
  }
  .card-image {
    border-radius:16px
  }
  .card-title {
    font-size:21px
  }
  .blog-article .head {
    padding:27px 0 24px
  }
  .article-back {
    margin-bottom:32px
  }
  .blog-article .dek {
    font-size:18px
  }
  .blog-article .prose {
    font-size:17px;
    line-height:1.72
  }
  .blog-article .prose h2 {
    font-size:26px
  }
  .blog-article .prose blockquote {
    font-size:23px;
    margin-left:0;
    margin-right:0
  }
  .blog-article figcaption {
    text-align:left
  }
  .blog-article .wide {
    margin:31px 0
  }
  .blog-footer {
    padding:29px 18px 38px
  }
  .blog-footer-inner {
    grid-template-columns:1fr;
    gap:18px
  }
  .footer-links {
    gap:12px 20px
  }
  .footer-note {
    grid-column:auto;
    margin-top:0
  }
}
/* Shared refinements for the article cover, metadata, and onward reading. */
.blog-word {
  font:500 14px Nohemi,Inter,sans-serif
}
.card-meta {
  font-size:12px;
  font-weight:600;
  line-height:1.55;
  color:#72797c
}
.article-hero {
  position:relative;
  left:50%;
  transform:translateX(-50%);
  width:min(900px,calc(100vw - 40px));
  margin:1px 0 47px;
  background:transparent
}
.article-hero img {
  display:block;
  width:100%;
  aspect-ratio:16/9;
  object-fit:contain;
  border-radius:20px;
  background:#f5f5f7
}
.article-hero.art-cover img {
  object-fit:cover
}
.article-hero figcaption {
  margin-top:8px;
  color:#7a8183;
  font-size:12px;
  line-height:1.45
}
.article-hero figcaption a { color:inherit }
.article-hero figcaption a:hover { color:#222 }
.related-stories {
  width:min(1240px,calc(100% - 48px));
  margin:75px auto 98px;
  padding-top:37px;
  border-top:1px solid var(--line)
}
.related-heading h2 {
  margin:0 0 28px;
  color:var(--ink);
  font:600 32px/1.15 Nohemi,Inter,sans-serif;
  letter-spacing:-.035em
}
@media(max-width:650px) {
  .blog-word {
    font-size:12px
  }
  .article-hero {
    width:calc(100vw - 36px);
    margin-bottom:34px;
    border-radius:16px
  }
  .related-stories {
    width:calc(100% - 36px);
    margin:57px auto 77px;
    padding-top:27px
  }
  .related-heading h2 {
    font-size:27px;
    margin-bottom:22px
  }
}
