.section { position: relative; overflow-x: clip; }
.motion-ready .section::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 22%;
  height: 1px;
  pointer-events: none;
  background: var(--bf-blue);
  box-shadow: 14px 0 var(--bf-green), 28px 0 var(--bf-red);
  transform: translateX(-130%);
}
.motion-ready .section.motion-active::after { animation: motionSectionScan 1150ms cubic-bezier(.16, 1, .3, 1) both; }
@keyframes motionSectionScan { to { transform: translateX(590%); opacity: 0; } }

.motion-ready .about .history-timeline,
.motion-ready .about .evidence-grid,
.motion-ready .ai .learning-loop,
.motion-ready .ai .textbook-item,
.motion-ready .ai .ritual-card,
.motion-ready .singapore .sg-tags,
.motion-ready .philosophy .quote-cn,
.motion-ready .philosophy .mascot-callout,
.motion-ready .contact .contact-card { opacity: 0; }

.about.motion-active .history-timeline { animation: motionTimelineDraw 980ms cubic-bezier(.16, 1, .3, 1) both; }
.about.motion-active .history-point { animation: motionPointRise 720ms cubic-bezier(.16, 1, .3, 1) both; }
.about.motion-active .history-point:nth-child(2) { animation-delay: 100ms; }
.about.motion-active .history-point:nth-child(3) { animation-delay: 200ms; }
.about.motion-active .history-point:nth-child(4) { animation-delay: 300ms; }
.about.motion-active .evidence-grid { animation: motionElasticGrid 920ms 260ms cubic-bezier(.16, 1, .3, 1) both; }
@keyframes motionTimelineDraw { from { opacity: 0; clip-path: inset(0 100% 0 0); } to { opacity: 1; clip-path: inset(0); } }
@keyframes motionPointRise { from { opacity: 0; translate: 0 32px; } to { opacity: 1; translate: 0; } }
@keyframes motionElasticGrid { 0% { opacity: 0; translate: 0 80px; scale: .94; } 65% { opacity: 1; translate: 0 -8px; scale: 1.01; } 100% { opacity: 1; translate: 0; scale: 1; } }

.ai.motion-active .learning-loop { animation: motionLoopIgnite 980ms cubic-bezier(.16, 1, .3, 1) both; }
.motion-signal { position: absolute; z-index: 3; top: 64px; left: 5px; width: 28px; height: 5px; opacity: 0; pointer-events: none; background: var(--bf-green); box-shadow: 10px 0 var(--bf-blue), 20px 0 var(--bf-red); }
.ai.motion-active .motion-signal { animation: motionSignalRun 3.4s 700ms cubic-bezier(.65, 0, .35, 1) both; }
.ai.motion-active .textbook-item { animation: motionElasticItem 820ms cubic-bezier(.16, 1, .3, 1) both; }
.ai.motion-active .textbook-item:nth-child(2) { animation-delay: 90ms; }
.ai.motion-active .textbook-item:nth-child(3) { animation-delay: 180ms; }
.ai.motion-active .textbook-item:nth-child(4) { animation-delay: 270ms; }
.ai.motion-active .textbook-item:nth-child(5) { animation-delay: 360ms; }
.ai.motion-active .ritual-card { animation: motionRitualWave 780ms cubic-bezier(.16, 1, .3, 1) both; animation-delay: calc((var(--motion-order, 0) + 1) * 65ms); }
@keyframes motionLoopIgnite { 0% { opacity: 0; translate: 0 36px; box-shadow: none; } 65% { opacity: 1; translate: 0; box-shadow: 0 0 0 4px var(--bf-blue), 0 28px 80px var(--card-shadow); } 100% { opacity: 1; translate: 0; } }
@keyframes motionSignalRun { 0% { opacity: 0; translate: 0; } 12%, 84% { opacity: 1; } 100% { opacity: 0; translate: calc(1000px - 100%) 0; } }
@keyframes motionElasticItem { 0% { opacity: 0; translate: 0 66px; rotate: 0 0 1 -3deg; } 68% { opacity: 1; translate: 0 -7px; rotate: 0 0 1 1deg; } 100% { opacity: 1; translate: 0; rotate: 0deg; } }
@keyframes motionRitualWave { 0% { opacity: 0; translate: 0 44px; rotate: 0 1 0 16deg; } 100% { opacity: 1; translate: 0; rotate: 0deg; } }

.singapore.motion-active .sg-tags { animation: motionTagsWake 820ms 180ms cubic-bezier(.16, 1, .3, 1) both; }
.singapore.motion-active .sg-tags span:hover { color: var(--bg-card); background: var(--bf-navy); border-color: var(--bf-navy); box-shadow: 6px 6px 0 var(--bf-green); }
@keyframes motionTagsWake { 0% { opacity: 0; filter: blur(5px); transform: translateY(10px) scaleX(.82); } 100% { opacity: 1; filter: none; transform: translateY(0) scaleX(1); } }

.motion-word { display: inline-block; }
.motion-ready .philosophy .motion-word { opacity: 0; transform: translate3d(0, 1em, 0) rotateX(-80deg); }
.philosophy.motion-active .quote-cn { opacity: 1; }
.philosophy.motion-active .quote-cn .motion-word { animation: motionQuoteWord 760ms cubic-bezier(.16, 1, .3, 1) both; animation-delay: calc(var(--word-index) * 78ms); }
.philosophy.motion-active .quote-cn em .motion-word { text-shadow: 4px 0 var(--bf-blue), -4px 0 var(--bf-green); }
.philosophy.motion-active .mascot-callout { animation: motionMascotReveal 920ms 420ms cubic-bezier(.16, 1, .3, 1) both; }
@keyframes motionQuoteWord { 0% { opacity: 0; transform: translate3d(0, 1em, 0) rotateX(-80deg); filter: blur(8px); } 100% { opacity: 1; transform: none; filter: none; } }
@keyframes motionMascotReveal { 0% { opacity: 0; clip-path: inset(0 50%); } 100% { opacity: 1; clip-path: inset(0); } }

.contact.motion-active .contact-card { animation: motionContactRise 820ms cubic-bezier(.16, 1, .3, 1) both; }
.contact.motion-active .contact-card:nth-child(2) { animation-delay: 130ms; }
.contact.motion-active .contact-card:nth-child(3) { animation-delay: 260ms; }
.contact .lines a { background-image: linear-gradient(var(--bf-blue), var(--bf-blue)); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 1px; transition: background-size 260ms ease, color 180ms ease; }
.contact .lines a:hover { background-size: 100% 1px; }
@keyframes motionContactRise { 0% { opacity: 0; translate: 0 52px; clip-path: inset(12% 0); } 100% { opacity: 1; translate: 0; clip-path: inset(0); } }

.footer.motion-active .foot-brand > a { animation: motionLogoBloom 880ms cubic-bezier(.16, 1, .3, 1) both; }
@keyframes motionLogoBloom { 0% { opacity: 0; transform: scale(.7) rotate(-8deg); filter: blur(12px); } 70% { opacity: 1; transform: scale(1.08) rotate(2deg); } 100% { opacity: 1; transform: none; filter: none; } }

@media (max-width: 820px) { .motion-signal { display: none; } }
@media (prefers-reduced-motion: reduce) { .motion-word, .motion-active * { opacity: 1; transform: none; filter: none; clip-path: none; animation: none; transition: none; } }