/* scrollGrow.css v7 — card grows only up to content height (no zoom) */
.timeline-section article.mcard{
  --p: 0;                 /* 0..1 progress from JS */
  --revealH: 0px;         /* set by JS per card to exact content height */
  min-height: 140px;
}

/* Reveal container: caps at real content height */
.timeline-section article.mcard .grow-reveal{
  max-height: calc(var(--revealH) * var(--p));
  overflow: hidden;
  /* bottom-up unveiling */
  clip-path: inset(calc((1 - var(--p)) * 100%) 0 0 0);
  transition: max-height 0.10s linear;
  will-change: max-height, clip-path;
}

.timeline-section article.mcard .grow-reveal > *{
  opacity: var(--p);
  transform: translateY(calc(16px * (1 - var(--p))));
  transition: opacity 0.10s linear, transform 0.10s linear;
}

.timeline-section article.mcard .grow-reveal ul{ margin: 12px 0 0; padding-left: 20px; list-style: disc; }
.timeline-section article.mcard .grow-reveal li{ margin: 6px 0; line-height: 1.5; color: var(--muted, #9fb2c5); }
.timeline-section article.mcard .grow-foot{ margin-top: 8px; font-size: 12px; color: var(--muted, #9fb2c5); }

@media (prefers-reduced-motion: reduce){
  .timeline-section article.mcard .grow-reveal{
    clip-path: inset(0 0 0 0) !important;
    max-height: none !important;
    transition: none !important;
  }
  .timeline-section article.mcard .grow-reveal > *{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* v7-noflicker: add safe bottom scroll space so the last expanded card never hits viewport edge */
.timeline-section{
  --timeline-safe-bottom: 120px; /* tweak if needed */
}
.timeline-section::after{
  content: "";
  display: block;
  height: var(--timeline-safe-bottom);
}