
body{background:var(--paper)}
.insights-hero{
  padding:104px 0 82px;
  border-bottom:1px solid rgba(41,40,33,.075);
  background:var(--paper);
}
.insights-hero h1{margin:14px 0 26px}
.insights-hero .lead{max-width:760px}
.chromatic-rule{
  width:118px;height:5px;display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr .8fr;
  overflow:hidden;border-radius:999px;margin:26px 0 0;
}
.chromatic-rule span:nth-child(1){background:var(--botanical)}
.chromatic-rule span:nth-child(2){background:var(--rust)}
.chromatic-rule span:nth-child(3){background:var(--ochre)}
.chromatic-rule span:nth-child(4){background:var(--olive)}
.chromatic-rule span:nth-child(5){background:var(--indigo)}

.posts-section{
  padding:92px 0 118px;
  background:#d4d7c8;
  border-top:1px solid rgba(41,40,33,.05);
}
.posts-toolbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:34px;
}
.posts-toolbar h2{
  font-size:clamp(30px,3.3vw,44px);
  margin:10px 0 0;
}
.filters{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.filter{
  appearance:none;
  border:1px solid rgba(49,65,55,.14);
  background:rgba(255,253,248,.34);
  color:#525b55;
  border-radius:999px;
  padding:9px 12px;
  font-size:10.5px;
  font-weight:610;
  cursor:pointer;
  transition:.18s ease;
}
.filter:hover{background:rgba(255,253,248,.64);transform:translateY(-1px)}
.filter.is-active{
  background:var(--botanical);
  border-color:var(--botanical);
  color:#fff;
}
.posts-count{
  margin:0 0 22px;
  font-size:11px;
  color:#666b62;
}
.posts-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.post-card{
  --card-accent:var(--botanical);
  position:relative;
  min-height:320px;
  padding:27px;
  border:1px solid rgba(70,77,61,.12);
  border-top:3px solid var(--card-accent);
  border-radius:18px;
  background:rgba(255,253,248,.48);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  cursor:pointer;
  overflow:hidden;
  transition:transform .22s ease,background .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.post-card:nth-child(3n+1){--card-accent:var(--botanical)}
.post-card:nth-child(3n+2){--card-accent:var(--rust)}
.post-card:nth-child(3n+3){--card-accent:var(--ochre)}
.post-card::after{
  content:"↗";
  position:absolute;
  right:22px;bottom:21px;
  width:30px;height:30px;
  display:grid;place-items:center;
  border:1px solid rgba(49,65,55,.14);
  border-radius:50%;
  font-size:10px;
  color:var(--botanical);
  transform:translateY(4px);
  opacity:.72;
  transition:.2s ease;
}
.post-card:hover,
.post-card:focus-within{
  transform:translateY(-4px);
  background:rgba(255,253,248,.84);
  box-shadow:0 18px 42px rgba(49,65,55,.08);
  border-color:rgba(49,65,55,.18);
}
.post-card:hover::after{transform:none;opacity:1;background:rgba(49,65,55,.06)}
.post-meta{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.11em;
  font-weight:700;
  color:var(--wine);
}
.post-card h3{
  font-size:26px;
  font-weight:610;
  line-height:1.08;
  letter-spacing:-.035em;
  margin:15px 0 14px;
  max-width:93%;
}
.post-card p{
  font-size:14px;
  line-height:1.56;
  color:#62675f;
  margin-bottom:34px;
}
.read-more{
  font-size:11.5px;
  font-weight:650;
  color:var(--botanical);
}
.post-card.is-hidden{display:none}

/* Article */
.article{
  padding:88px 0 118px;
  background:var(--paper);
}
.article-wrap{max-width:900px}
.back{
  display:inline-flex;
  margin-bottom:44px;
  font-size:11.5px;
  font-weight:610;
  color:#6e7169;
  transition:color .18s ease,transform .18s ease;
}
.back:hover{color:var(--botanical);transform:translateX(-2px)}
.article-meta{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:700;
  color:var(--wine);
}
.article h1{margin:14px 0 28px}
.article-deck{
  font-size:clamp(18px,1.75vw,21px);
  line-height:1.55;
  color:#4c5a54;
  max-width:790px;
}
.article-body{
  max-width:760px;
  margin-top:66px;
  font-size:18px;
  line-height:1.78;
  color:#383a35;
}
.article-body p{margin-bottom:29px}
.article-body h2{
  margin:56px 0 20px;
  font-size:clamp(30px,3vw,40px);
  line-height:1.06;
}
.article-body blockquote{
  margin:44px 0;
  padding:2px 0 2px 22px;
  border-left:3px solid var(--rust);
  font-size:23px;
  line-height:1.48;
  font-weight:500;
  letter-spacing:-.025em;
  color:#36423c;
}
.author-signature{
  max-width:760px;
  margin-top:72px;
  padding-top:23px;
  border-top:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  font-size:12.5px;
  color:#686c64;
}
.author-signature strong{color:var(--ink);font-weight:620}

/* Same footer language as LP */
footer{
  padding:48px 0;
  background:#1f3029;
  color:#eef2ee;
}
.footer-inner{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  flex-wrap:wrap;
}
footer .brand-mark{border-color:rgba(255,255,255,.34);color:#fff}
footer .brand small{color:#bdc8c2}
.domain{font-size:12px;color:#bdc8c2}

.js-reveal{
  opacity:0;
  transform:translateY(10px);
  transition:opacity .48s ease,transform .48s ease;
}
.js-reveal.is-visible{opacity:1;transform:none}

@media(max-width:920px){
  .posts-toolbar{align-items:flex-start;flex-direction:column}
  .filters{justify-content:flex-start}
  .posts-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:640px){
  .insights-hero{padding:72px 0 62px}
  .posts-section{padding:70px 0 84px}
  .posts-grid{grid-template-columns:1fr}
  .post-card{min-height:0}
  .article{padding:62px 0 84px}
  .author-signature{align-items:flex-start;flex-direction:column}
}
@media(prefers-reduced-motion:reduce){
  *{transition-duration:.01ms!important}
  .js-reveal{opacity:1;transform:none}
}
