/* About Us navigation and compact history. Loaded on About Us only. */
.about-nav { top:var(--header-h); z-index:40; }
.about-nav a { min-height:3.25rem; display:flex; align-items:center; white-space:nowrap; }
.about-nav a[aria-current="location"] { color:var(--green-800); box-shadow:inset 0 -3px var(--orange-500); }
.about-nav a:focus-visible { outline:2px solid var(--orange-500); outline-offset:-4px; }
body[data-page="about"] main > section[id] { scroll-margin-top:calc(var(--header-h) + 4rem); }
.history-experience { padding-block:clamp(2.5rem,4vw,4rem); }
.history-intro { gap:2rem; }
.history-intro h2 { max-width:none; font-size:clamp(2.5rem,3.4vw,3.5rem); }
.history-intro > p { font-size:1rem; line-height:1.5; margin:0; }
.history-app { margin-top:1.5rem; }
.history-help { margin:0 0 .75rem; font-size:.85rem; color:var(--ink-600); }
.history-carousel-controls { padding-inline:2%; }
.history-rail { align-items:stretch; gap:1rem; padding:.5rem 2% 1rem; }
.history-decade { transform:none; flex-basis:96%; grid-template-columns:minmax(15rem,.6fr) minmax(0,1.4fr); }
.history-decade__header { min-height:0; padding:1.5rem; }
.history-decade__period { margin-top:1.5rem; font-size:clamp(3.5rem,5vw,5rem); }
.history-decade__header h3 { max-width:15ch; margin:1.5rem 0 .8rem; font-size:clamp(1.8rem,2.2vw,2.4rem); line-height:1.05; }
.history-decade[data-history-chapter="industrial-growth"] .history-decade__header h3 { font-size:clamp(1.7rem,2vw,2.2rem); }
.history-decade__header p { padding-top:.75rem; font-size:.9rem; line-height:1.5; }
.history-decade__milestones { grid-template-columns:repeat(2,minmax(0,1fr)); }
.history-milestone { grid-template-columns:1.3rem minmax(0,1fr); gap:.5rem; padding:1rem; }
.history-milestone h4 { display:inline; font-size:1.15rem; line-height:1.2; }
@media (max-width:820px) {
  .history-intro { gap:1rem; }
  .history-decade { grid-template-columns:1fr; }
  .history-decade__header { display:grid; grid-template-columns:auto 1fr; column-gap:1rem; align-items:start; }
  .history-decade__index { grid-column:1/-1; }
  .history-decade__period { grid-column:1; margin-top:1rem; font-size:3.5rem; line-height:1; }
  .history-decade__header h3 { grid-column:2; margin:1rem 0 0; font-size:1.8rem; }
  .history-decade__header p { grid-column:1/-1; margin-top:.75rem; padding-top:0; }
}
@media (max-width:560px) {
  .about-nav .container { width:100%; }
  .about-nav a { padding:.8rem 1rem; font-size:.8rem; }
  .history-decade { flex-basis:96%; }
  .history-decade__header { padding:1.1rem; }
  .history-decade__header h3 { font-size:1.55rem; }
  .history-decade[data-history-chapter="industrial-growth"] .history-decade__header h3 { font-size:1.45rem; }
  .history-decade__milestones { grid-template-columns:1fr; }
  .history-milestone { padding:.85rem 1rem; }
}

/* History movement stays on the horizontal axis. */
.history-rail { overflow-y:hidden; overscroll-behavior-x:contain; overscroll-behavior-y:auto; touch-action:pan-x pan-y pinch-zoom; }
.history-decade { scroll-snap-align:none center; transition:opacity .4s ease, box-shadow .4s ease; }
.history-experience .reveal { transform:none; transition-property:opacity; }
.history-experience .carousel-control-button:hover:not(:disabled) { transform:none; }