/* Editorial reading surface. Scoped to opinion pieces, not the clinical guides. */
.reflection-page {
  --paper: #faf8f3;
  --ink: #263b43;
  --navy: #153b49;
  --teal: #17656a;
  --muted: #59696d;
  --line: #d9dfdb;
  background: var(--paper);
  color: var(--ink);
  color-scheme: light;
}
html[data-reading-theme="dark"] .reflection-page {
  --paper: #17262d;
  --ink: #e1e6e3;
  --navy: #f0f3ee;
  --teal: #9bd6cc;
  --muted: #b6c4c6;
  --line: #40555c;
  color-scheme: dark;
}
.reflection-page .article-shell {max-width: 800px; padding: 34px 40px 76px;}
.reflection-page .reading-topbar {display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 46px;}
.reflection-page .breadcrumbs {margin: 0; font-size: 14px;}
.reflection-page button.reading-theme {display: inline-flex; align-items: center; gap: 9px; min-height: 44px; padding: 9px 14px; border: 1px solid var(--line); border-radius: 30px; background: transparent; color: var(--ink); font: inherit; font-size: 14px; cursor: pointer; white-space: nowrap;}
.reflection-page .reading-theme[hidden] {display: none;}
.reflection-page .reading-theme svg {width: 17px; height: 17px;}
.reflection-page :is(button,a):focus-visible {outline: 3px solid var(--teal); outline-offset: 5px;}
.reflection-page .opinion-article > .eyebrow {font-size: 12px; letter-spacing: 2px; margin: 0 0 20px;}
.reflection-page .opinion-article > h1 {font-size: clamp(38px, 4.5vw, 58px); line-height: 1.1; letter-spacing: -1.3px; margin-bottom: 24px; text-wrap: balance;}
.reflection-page .article-deck {font-family: Georgia, 'Times New Roman', serif; font-size: 23px; line-height: 1.5; color: var(--muted); max-width: 620px; margin: 0 0 28px;}
.reflection-page .article-byline {font-size: 14px; line-height: 1.7; margin-bottom: 37px; padding-bottom: 27px; border-bottom: 1px solid var(--line); color: var(--muted);}
.reflection-page .article-byline strong {color: var(--ink); font-weight: 600;}
.reflection-page .article-byline time {white-space: nowrap;}
.reflection-page .article-body {font-family: Georgia, 'Times New Roman', serif; font-size: 21px; line-height: 1.82; text-align: left; overflow-wrap: break-word;}
.reflection-page .article-body p {margin: 0 0 1.35em;}
.reflection-page .article-body h2 {font-size: 31px; line-height: 1.25; letter-spacing: -.5px; margin: 50px 0 23px; text-wrap: balance;}
.reflection-page .article-body .closing-question {font-size: 25px; line-height: 1.5; color: var(--navy); padding: 25px 0 25px 23px; border-left: 3px solid var(--teal); margin: 38px 0;}
.reflection-page .article-end {margin-top: 44px; padding-top: 23px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px;}
.reflection-page .article-end .back-to-blog {margin: 0;}
.reflection-page .share-article {font-size: 14px; color: var(--teal); text-decoration: underline; text-underline-offset: 4px;}
.reflection-page footer {background: #102f45;}
.reflection-page .header-cta {border-color: var(--teal); color: var(--teal);}
.reflection-page header .monogram {color: var(--navy);}
.reflection-page ::selection {background: #c9dfd8; color: #172f38;}
@media (max-width: 650px) {
  .reflection-page .article-shell {padding: 24px 24px 48px;}
  .reflection-page .reading-topbar {gap: 12px; margin-bottom: 32px;}
  .reflection-page .breadcrumbs {width: auto; font-size: 13px; gap: 9px;}
  .reflection-page .reading-theme {font-size: 13px; padding: 8px 11px;}
  .reflection-page .opinion-article > h1 {font-size: 39px; letter-spacing: -.8px; line-height: 1.13;}
  .reflection-page .article-deck {font-size: 21px; line-height: 1.5;}
  .reflection-page .article-body {font-size: 19px; line-height: 1.8;}
  .reflection-page .article-body h2 {font-size: 28px; margin-top: 40px;}
  .reflection-page .article-body .closing-question {font-size: 23px; padding-left: 18px;}
}
@media (max-width: 359px) {
  .reflection-page .article-shell {padding-left: 20px; padding-right: 20px;}
  .reflection-page .opinion-article > h1 {font-size: 35px;}
  .reflection-page .reading-topbar {flex-wrap: wrap;}
}
@media print {
  .reflection-page {--paper: #fff; --ink: #222; --navy: #111; --muted: #444; --line: #ccc; background: white; color: #222;}
  .reflection-page > header, .reflection-page > footer, .reflection-page .reading-topbar, .reflection-page .article-end {display: none;}
  .reflection-page .article-shell {max-width: none; padding: 0;}
  .reflection-page .article-body {font-size: 12pt; line-height: 1.6;}
  .reflection-page h2 {break-after: avoid;}
  .reflection-page p {orphans: 3; widows: 3;}
}