/* A few editorial highlights per section, using the hero tooltip's marker stroke. */
.page--home .text-marker {
  --marker-fill: #ded0ff;
  position: relative;
  isolation: isolate;
  display: inline-block;
  max-width: 100%;
  padding-inline: .09em;
  margin-inline: .015em;
  background: transparent;
  color: #21182c;
  -webkit-text-fill-color: #21182c;
  font: inherit;
  letter-spacing: inherit;
  text-shadow: none;
}
.page--home .text-marker::before {
  content: '';
  position: absolute;
  z-index: -1;
  inset: .09em -.025em .015em;
  background: var(--marker-fill);
  transform: rotate(-1.1deg);
  clip-path: polygon(1% 8%, 98% 0, 100% 86%, 3% 100%, 0 71%);
}
.page--home .text-marker--mint { --marker-fill: #bee1c5; }
.page--home .text-marker--mint::before { transform: rotate(.7deg); }
.page--home .text-marker--peach { --marker-fill: #f3d3a0; }
.page--home :is(p, li) .text-marker { font-weight: 600; }
@media (forced-colors: active) {
  .page--home .text-marker { background: Highlight; color: HighlightText; -webkit-text-fill-color: HighlightText; }
  .page--home .text-marker::before { display: none; }
}
@media print {
  .page--home .text-marker { font-weight: 700; text-decoration: underline; }
}