/* Author: Kiriago <kiryc0de@gmail.com> (https://github.com/kirycode/) - Milestones timeline (U-026 overnight H). Own class prefix afam-ms (the old .afam-tl name collided with the AJOM stepper). */
.afam-ms { --ms-line: var(--afam-gold-500, #cbae2d); list-style: none; margin: 0 auto; padding: 8px 0 0; max-width: 1400px; position: relative; }
.afam-ms::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 4px; margin-left: -2px; background: linear-gradient(var(--afam-gold-500, #cbae2d), var(--afam-green-500, #0c643a)); border-radius: 2px; }
.afam-ms__item { position: relative; margin: 0 0 32px; padding: 0; width: 45%; box-sizing: border-box; }
.afam-ms__item.is-right { margin-left: 55%; }
.afam-ms__year { position: absolute; top: 16px; left: calc(100% + 11.111%); transform: translateX(-50%); z-index: 2; min-width: 76px; padding: 6px 14px; text-align: center; border-radius: 999px; background: var(--afam-green-500, #0c643a); color: #fff; font-weight: 700; font-size: 1.05rem; line-height: 1.3; border: 4px solid #fff; box-shadow: 0 0 0 2px var(--afam-gold-500, #cbae2d); box-sizing: border-box; }
.afam-ms__item.is-right .afam-ms__year { left: -11.111%; }
.afam-ms__card { background: #fff; border: 1px solid #d7e3dc; border-top: 5px solid var(--afam-gold-500, #cbae2d); border-radius: 14px; padding: 18px 24px 20px; box-shadow: 0 6px 18px rgba(8, 76, 44, .08); text-align: left; }
.afam-ms__title { margin: 0 0 8px; font-size: 1.2rem; line-height: 1.3; color: var(--afam-green-900, #084c2c); text-align: left; }
.afam-ms__body { line-height: 1.65; color: var(--afam-ink-900, #1a1a1a); overflow-wrap: anywhere; }
.afam-ms__body > :first-child { margin-top: 0; }
.afam-ms__body > :last-child { margin-bottom: 0; }
.afam-ms__body p { margin: 0 0 .6em; text-align: left; }
.afam-ms__body ul { margin: .4em 0 .6em 1.2em; padding: 0; list-style: disc; text-align: left; }
.afam-ms__body li { margin: 0 0 .35em; }
/* Long entries: shortened to about four lines only when the script has run (the full text is in the page without it). */
html.afam-ms-js .afam-ms__body.is-clamped { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; line-clamp: 4; overflow: hidden; }
.afam-ms__more { margin: 10px 0 0; padding: 8px 16px; min-height: 40px; border: 2px solid var(--afam-green-500, #0c643a); border-radius: 999px; background: #fff; color: var(--afam-green-900, #084c2c); font: inherit; font-weight: 700; cursor: pointer; }
.afam-ms__more:hover { background: var(--afam-surface, #f7f9f5); }
.afam-ms__more:focus-visible { outline: 3px solid var(--afam-orange-500, #e06c17); outline-offset: 2px; }
@media (max-width: 1023px) {
	.afam-ms::before { left: 28px; margin-left: -2px; }
	.afam-ms__item, .afam-ms__item.is-right { width: auto; margin: 0 0 24px; padding-left: 64px; }
	.afam-ms__year, .afam-ms__item.is-right .afam-ms__year { position: relative; left: auto; top: auto; margin: 0 0 8px; transform: none; display: inline-block; width: auto; }
	.afam-ms__item::before { content: ""; position: absolute; left: 28px; top: 26px; width: 16px; height: 16px; margin-left: -8px; border-radius: 50%; background: var(--afam-green-500, #0c643a); border: 3px solid #fff; box-shadow: 0 0 0 2px var(--afam-gold-500, #cbae2d); box-sizing: border-box; z-index: 2; }
	.afam-ms__card { padding: 16px 18px 18px; }
}
@media (max-width: 480px) {
	.afam-ms::before { left: 14px; }
	.afam-ms__item, .afam-ms__item.is-right { padding-left: 38px; }
	.afam-ms__item::before { left: 14px; }
}
@media (prefers-reduced-motion: reduce) { .afam-ms * { transition: none !important; } }

/* U-027 review A9: scroll animation (only when the script adds html.afam-ms-anim; never when the visitor prefers reduced motion). */
.afam-ms__year { --ms-tx: -50%; }
@media (max-width: 1023px) { .afam-ms__year, .afam-ms__item.is-right .afam-ms__year { --ms-tx: 0px; } }
html.afam-ms-anim .afam-ms::before { transform-origin: top center; transform: scaleY(var(--ms-p, 0)); }
html.afam-ms-anim .afam-ms__item { opacity: 0; transform: translateX(-70px); transition: opacity .6s ease, transform .6s cubic-bezier(.2, .7, .2, 1); }
html.afam-ms-anim .afam-ms__item.is-right { transform: translateX(70px); }
html.afam-ms-anim .afam-ms__item.is-in { opacity: 1; transform: none; }
html.afam-ms-anim .afam-ms__year { opacity: 0; transform: translateX(var(--ms-tx)) scale(.4); }
html.afam-ms-anim .afam-ms__item.is-in .afam-ms__year { opacity: 1; animation: afam-ms-pop .55s .25s cubic-bezier(.3, 1.6, .5, 1) both; }
@keyframes afam-ms-pop { 0% { opacity: 0; transform: translateX(var(--ms-tx)) scale(.4); } 70% { opacity: 1; transform: translateX(var(--ms-tx)) scale(1.18); } 100% { opacity: 1; transform: translateX(var(--ms-tx)) scale(1); } }
@media (max-width: 1023px) { html.afam-ms-anim .afam-ms__item, html.afam-ms-anim .afam-ms__item.is-right { transform: translateX(34px); } html.afam-ms-anim .afam-ms__item.is-in { transform: none; } }
@media (prefers-reduced-motion: reduce) { html.afam-ms-anim .afam-ms__item, html.afam-ms-anim .afam-ms__year { opacity: 1 !important; transform: none !important; animation: none !important; } html.afam-ms-anim .afam-ms::before { transform: none; } }
