.herbal-topic-nav { margin-bottom: 30px; }
.herbal-topic-nav a { background: #fff; border: 1px solid #d9e5e2; color: #173451; }
.herbal-topic-nav a[aria-current="true"] { background: #173451; border-color: #173451; color: #fff; }
.herbal-topic-nav a span { margin-left: 4px; font-size: 12px; opacity: .8; }
.herbal-topic-panel[hidden] { display: none; }
.herbal-topic-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 24px; }
.herbal-topic-heading h2 { margin: 0; font-size: clamp(28px, 4vw, 36px); }
.herbal-topic-heading p { margin: 0; color: #647184; font-size: 14px; white-space: nowrap; }
.herbal-kind + .herbal-kind { margin-top: 30px; }
.herbal-kind h3 { margin: 0 0 12px; color: #177f76; font-size: 17px; }
.herbal-kind .article-card:only-child { grid-column: 1 / -1; }
.herbal-related { margin-top: 26px; padding-top: 16px; border-top: 1px solid #d9e5e2; }
.herbal-related summary { padding: 10px 0; color: #285846; font-weight: 800; cursor: pointer; }
.herbal-related ul { margin: 6px 0 0; padding-left: 22px; }
.herbal-related li + li { margin-top: 8px; }
.herbal-related a { color: #173451; text-decoration: underline; text-underline-offset: 3px; }
.herbal-journal-link { margin: 30px 0 0; }
.herbal-concerns { scroll-margin-top: 125px; }
.herbal-concern-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 12px 20px; }
.herbal-concern-heading h2 { margin: 0; min-width: 0; }
.herbal-concern-heading p { grid-column: 1 / -1; margin: 0; }
.btn.herbal-browse-button { gap: 10px; min-height: 44px; margin-top: 0; padding: 0 16px; font-size: 13px; line-height: 1.4; white-space: nowrap; }
.btn.herbal-browse-button:hover { background: #f0f3f6; }
.herbal-browse-button:focus-visible { outline: 3px solid #173451; outline-offset: 3px; }
.herbal-concern-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 24px; }
.herbal-concern-trigger { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; max-width: 100%; padding: 10px 16px; border: 1px solid #cfdfd6; border-radius: 999px; background: #fff; color: #374b43; font: inherit; font-size: 15px; line-height: 1.4; cursor: pointer; }
.herbal-concern-trigger span { font-size: 12px; opacity: .7; }
.herbal-concern-trigger[aria-pressed="true"] { background: #177f76; border-color: #177f76; color: #fff; }
.herbal-concern-trigger:hover { box-shadow: 0 0 0 2px #177f7628; }
.herbal-concern-trigger:focus-visible { outline: 3px solid #173451; outline-offset: 3px; }
.herbal-landing-results { padding-top: 22px; border-top: 1px solid #d9e5e2; min-width: 0; }
.herbal-landing-panel { scroll-margin-top: 160px; }
.herbal-landing-panel[hidden] { display: none; }
.herbal-landing-panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.herbal-landing-panel-heading h3 { margin: 0 0 6px; color: #173451; font-size: 23px; line-height: 1.4; }
.herbal-landing-panel-heading p { margin: 0; color: #647184; font-size: 14px; }
.herbal-panel-more { flex: none; color: #176f68; font-size: 14px; font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.herbal-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.herbal-feature-card { position: relative; min-width: 0; display: flex; flex-direction: column; align-items: flex-start; padding: 16px; border: 1px solid #d9e5e2; border-radius: 14px; background: #fff; overflow-wrap: anywhere; cursor: pointer; }
.herbal-feature-card:hover { border-color: #8eafa0; box-shadow: 0 4px 14px #1734510a; }
.herbal-feature-card:focus-within { outline: 3px solid #177f76; outline-offset: 3px; }
.herbal-feature-kind { color: #177f76; font-size: 12px; font-weight: 800; }
.herbal-feature-card h4 { margin: 6px 0; color: #173451; font-size: 17px; line-height: 1.5; }
.herbal-feature-card p { margin: 0 0 10px; color: #647184; font-size: 13px; display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.herbal-feature-card a { margin-top: auto; color: #176f68; font-size: 14px; font-weight: 800; text-decoration: none; }
.herbal-feature-card a::after { content: ""; position: absolute; inset: 0; border-radius: 14px; }
.herbal-care-note { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid #d9e5e2; font-size: 13px; color: #647184; overflow-wrap: anywhere; }
.herbal-care-note strong { color: #173451; margin-right: 6px; }
.herbal-article-context { width: min(820px, calc(100% - 36px)); margin: 24px auto -18px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: #526174; font-size: 14px; }
.herbal-article-context a { color: #285846; font-weight: 800; text-decoration: none; }
.herbal-article-context a:hover, .herbal-article-context a:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
.herbal-article-kind { margin-left: auto; padding: 4px 9px; border-radius: 6px; background: #e8f6f3; color: #285846; font-size: 12px; font-weight: 800; }
@media (min-width: 881px) and (max-width: 1399px) {
  .herbal-concerns > .wrap { width: auto; max-width: 1120px; margin-left: max(20px, calc((100% - 1120px) / 2)); margin-right: 140px; }
}
@media (max-width: 760px) {
  .herbal-concern-heading { grid-template-columns: minmax(0, 1fr); }
  .herbal-browse-button { justify-self: start; }
  .herbal-topic-nav { position: static; flex-wrap: wrap; overflow: visible; }
  .herbal-topic-heading { display: block; }
  .herbal-topic-heading p { margin-top: 4px; white-space: normal; }
  .herbal-landing-panel-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .herbal-feature-grid { grid-template-columns: minmax(0, 1fr); }
  .herbal-concern-trigger { padding: 9px 13px; font-size: 14px; }
  .herbal-article-kind { margin-left: 0; }
}