/* Editorial treatment for the Insights area */
.insights {
  background: var(--deep);
  color: var(--cream);
}

.insights .section-label,
.insights .tag { color: var(--sand); }

.insights-heading .eyebrow { margin-bottom: 18px; }

.button-outline {
  color: var(--cream);
  border: 1px solid rgba(242, 239, 232, .5);
  white-space: nowrap;
}

.insights-editorial {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  border-top: 1px solid rgba(242, 239, 232, .3);
  border-bottom: 1px solid rgba(242, 239, 232, .3);
}

.insight-featured {
  min-height: 430px;
  padding: 42px 8% 45px 0;
  border-right: 1px solid rgba(242, 239, 232, .3);
  position: relative;
}

.feature-kicker {
  font: 500 22px "Playfair Display", serif;
  margin: 65px 0 11px;
  color: var(--sand);
}

.insight-featured h3 {
  max-width: 600px;
  margin: 0;
  font: 500 clamp(34px, 3.6vw, 56px) / .98 "Playfair Display", serif;
  letter-spacing: -.04em;
}

.insight-featured h3 + p {
  max-width: 500px;
  margin: 24px 0 27px;
  color: #bfd0cc;
  font-size: 16px;
  line-height: 1.55;
}

.insight-featured a {
  color: var(--cream);
  font-size: 13px;
  text-underline-offset: 5px;
}

.insight-featured a span { font-size: 18px; margin-left: 10px; }

.feature-number {
  position: absolute;
  right: 7%;
  bottom: 31px;
  margin: 0;
  color: rgba(242, 239, 232, .13);
  font: 500 90px / .7 "Playfair Display", serif;
}

.insight-secondary { display: grid; grid-template-rows: 1fr 1fr; }

.insight-secondary article {
  min-height: 215px;
  padding: 36px 0 30px 10%;
  position: relative;
}

.insight-secondary article + article { border-top: 1px solid rgba(242, 239, 232, .3); }

.insight-secondary h3 {
  max-width: 310px;
  margin: 28px 44px 0 0;
  font: 500 28px / 1.02 "Playfair Display", serif;
  letter-spacing: -.025em;
}

.insight-secondary a {
  position: absolute;
  right: 0;
  bottom: 28px;
  color: var(--sand);
  font-size: 22px;
  text-decoration: none;
}

@media (max-width: 760px) {
  .insights-heading .button { display: inline-flex; margin-top: 27px; }
  .insights-editorial { display: block; }
  .insight-featured { min-height: 390px; padding: 30px 0; border-right: 0; border-bottom: 1px solid rgba(242, 239, 232, .3); }
  .feature-kicker { margin-top: 48px; }
  .insight-secondary article { min-height: 220px; padding: 28px 0; }
  .insight-secondary h3 { font-size: 27px; }
}
