/* Key phrases on the landing page (owner's decision, 31 October 2026).
   Six short phrases that set the practice apart are marked in orange, the
   one accent outside the logo palette, used only here. Each mark is drawn
   once, like a highlighter stroke in the reading direction, when the phrase
   reaches the reading zone. The text is always visible; only the stroke
   moves. Phrases and keys live in keyphrases.js; the copy itself is untouched. */
.hl{
  --hl-bg:#FFD3BA;
  font-size:1.14em;font-weight:600;letter-spacing:-.005em;
  padding-inline:.12em;margin-inline:-.12em;border-radius:2px;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  background:linear-gradient(var(--hl-bg),var(--hl-bg)) no-repeat right 88%/0% 62%;
  transition:background-size .7s cubic-bezier(.16,1,.3,1),color .3s ease;
}
html:not([dir="rtl"]) .hl{background-position:left 88%}
h1 .hl,h2 .hl,h3 .hl{font-size:1.06em;font-weight:inherit}
.hl.on{background-size:100% 62%}
/* on the dark sections the stroke is full orange and the words turn white */
.dk .hl{--hl-bg:#FF4F00}
.dk .hl.on{color:#FFFFFF}
@media (prefers-reduced-motion:reduce){.hl{transition:none}}
