/* All article styles are scoped. Existing home sections retain their layout. */
.learning-article-view { max-width: 1150px; margin-inline: auto; }
.learning-story { color: #233c33; padding-block: 30px 60px; }
.learning-story-header { max-width: 910px; margin: 0 auto 52px; border-bottom: 1px solid #cbd5cd; padding-bottom: 32px; }
.learning-eyebrow { font-size: 13px; font-weight: 750; letter-spacing: .12em; text-transform: uppercase; color: #246b59; }
.learning-story h1 { font: 500 clamp(38px, 5.3vw, 70px)/1.08 Georgia, serif; letter-spacing: -.035em; margin: 22px 0; max-width: 850px; }
.learning-deck { font-size: clamp(20px, 2.2vw, 25px); line-height: 1.5; max-width: 790px; color: #4c6157; }
.learning-meta { color: #596b61; font-size: 14px; margin-top: 26px; }
.learning-prose { max-width: 760px; margin-inline: auto; font-size: 20px; line-height: 1.8; }
.learning-prose p { margin: 0 0 23px; }
.learning-prose h2 { font: 500 clamp(29px, 3.1vw, 39px)/1.2 Georgia, serif; letter-spacing: -.02em; margin: 54px 0 22px; }
.learning-story a { color: #205c4c; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; overflow-wrap: anywhere; }
.learning-story a:hover { color: #913e25; }
.learning-story a:focus-visible { outline: 3px solid #b8783e; outline-offset: 4px; }
.learning-figure { margin: 32px -28px 34px; padding: 28px; background: #f0f2e9; border-top: 3px solid #246b59; }
.learning-figure header { display: flex; gap: 18px; align-items: baseline; }
.learning-chart-number { color: #246b59; font: 500 26px Georgia, serif; }
.learning-figure h3 { font: 600 24px/1.25 Georgia, serif; margin: 0 0 8px; }
.learning-figure header p { color: #53655b; font-size: 14px; line-height: 1.5; margin: 0; }
.learning-donut-layout { display: grid; grid-template-columns: minmax(190px, .9fr) 1.25fr; gap: 28px; align-items: center; padding: 28px 0; }
.learning-donut { width: 100%; max-width: 270px; justify-self: center; font-family: inherit; }
.learning-chart-legend > div { display: flex; align-items: baseline; gap: 12px; margin-block: 20px; }
.learning-chart-legend p { margin: 0; font-size: 18px; line-height: 1.5; }
.learning-chart-legend small { display: block; font-size: 14px; color: #53655b; margin-top: 5px; }
.learning-chart-key { display: block; width: 12px; height: 12px; flex-shrink: 0; }
.learning-chart-key.heating { background: #246b59; }
.learning-chart-key.other { background: #dce1d7; border: 1px solid #748878; }
.learning-figure figcaption { border-top: 1px solid #ced8cd; padding-top: 16px; font-size: 13px; line-height: 1.65; color: #4d6055; }
.learning-trial { padding: 25px 0 18px; }
.learning-trial .learning-axis-caption { font-size: 14px; line-height: 1.5; color: #53655b; margin-bottom: 24px; }
.learning-bar-label { display: flex; justify-content: space-between; gap: 18px; font-size: 16px; line-height: 1.5; margin-top: 22px; margin-bottom: 9px; }
.learning-bar-label b { color: #173d36; }
.learning-bar-track { position: relative; height: 35px; background: #e3e7dc; }
.learning-bar { height: 100%; }
.learning-bar.control { background: #8e9d8b; }
.learning-bar.insulated { background: #246b59; }
.learning-confidence { position: absolute; top: 50%; transform: translateY(-50%); height: 15px; border-inline: 2px solid #172e24; background: linear-gradient(#172e24,#172e24) center / 100% 2px no-repeat; filter: drop-shadow(0 0 1px white); }
.learning-chart-axis { display: flex; justify-content: space-between; font-size: 12px; color: #53655b; margin-top: 7px; }
.learning-temperature { display: flex; align-items: center; gap: 18px; padding-top: 24px; font-size: 15px; line-height: 1.5; }
.learning-temperature strong { font: 500 39px/1.1 Georgia, serif; color: #99552f; white-space: nowrap; }
.learning-closing { font: 500 28px/1.5 Georgia, serif; border-left: 3px solid #b87b42; padding-left: 24px; margin-top: 32px !important; }
.learning-sources { border-top: 1px solid #cbd5cd; margin-top: 50px; }
.learning-sources h2 { margin-top: 32px; }
.learning-sources ol { padding-left: 24px; font-size: 15px; line-height: 1.6; }
.learning-sources li { margin-bottom: 18px; padding-left: 6px; }
.learning-sources li p { margin: 6px 0 0; font-size: 14px; color: #596b61; }
.learning-sources .learning-methods { margin-top: 28px; font-size: 14px; line-height: 1.7; color: #596b61; }
@media (max-width: 650px) {
  .learning-story { padding-top: 15px; }
  .learning-story-header { margin-bottom: 30px; }
  .learning-prose { font-size: 18px; line-height: 1.75; }
  .learning-figure { margin-inline: 0; padding: 20px 15px; }
  .learning-figure header { gap: 10px; }
  .learning-figure h3 { font-size: 23px; }
  .learning-donut-layout { grid-template-columns: 1fr; gap: 0; padding: 20px 0 5px; }
  .learning-donut { max-width: 225px; }
  .learning-chart-legend p { font-size: 17px; }
  .learning-figure figcaption { font-size: 13px; }
  .learning-bar-label { font-size: 15px; }
  .learning-closing { font-size: 24px; padding-left: 18px; }
  .learning-temperature { gap: 12px; font-size: 14px; }
}