/* Restrained motion layered over the original MT5 design. */
:root { --motion-ease: cubic-bezier(.22,1,.36,1); }
.btn { position: relative; isolation: isolate; overflow: hidden; transition: transform .35s var(--motion-ease), background .3s, border-color .3s, box-shadow .4s; }
.btn-primary { background: linear-gradient(120deg,#306bea,#478cff 55%,#3d7bff); box-shadow: 0 8px 28px -9px #3d7bff88,inset 0 1px 0 #ffffff30; }
.btn::before { content:""; position:absolute; z-index:-1; inset:-80% -50%; background:linear-gradient(110deg,transparent 40%,#ffffff08 44%,#ffffff70 49%,#ffffff18 54%,transparent 60%); transform:translateX(-85%) skewX(-12deg); pointer-events:none; }
.btn-primary::before { animation:mt5-shimmer 6.8s var(--motion-ease) infinite; }
.header-cta .btn::before { animation-delay:1.1s; }
.cta-box .btn::before { animation-delay:2.1s; }
.btn-primary::after { content:""; position:absolute; inset:0; pointer-events:none; border-radius:inherit; box-shadow:inset 0 0 0 1px #ffffff28; background:radial-gradient(circle at 82% 18%,#fff9 0,transparent 2px),radial-gradient(circle at 87% 32%,#fff4 0,transparent 1.5px); animation:mt5-sparkle 6.8s ease-in-out infinite; }
.btn:hover,.btn:focus-visible { transform:translateY(-3px); }
.btn-primary:hover,.btn-primary:focus-visible { box-shadow:0 14px 35px -10px #3d7bffb0,inset 0 1px 0 #ffffff55; }
.btn-ghost:hover::before,.btn-ghost:focus-visible::before { animation:mt5-shimmer .95s var(--motion-ease) 1; }
.btn svg { transition:transform .35s var(--motion-ease); }
.btn:hover svg,.btn:focus-visible svg { transform:translateY(-2px); }
.btn:active { transform:translateY(0) scale(.98); }
.btn-ripple { position:absolute; width:20px; height:20px; margin:-10px; border-radius:50%; background:#ffffff32; pointer-events:none; animation:mt5-ripple .7s ease-out forwards; }
@keyframes mt5-shimmer { 0%,62% { transform:translateX(-85%) skewX(-12deg); } 84%,100% { transform:translateX(85%) skewX(-12deg); } }
@keyframes mt5-sparkle { 0%,60%,100% { opacity:0; } 73% { opacity:.85; } 84% { opacity:.12; } }
@keyframes mt5-ripple { to { transform:scale(25); opacity:0; } }

.hero::before { animation:mt5-aurora 14s ease-in-out infinite alternate; transform-origin:70% 35%; }
.hero-grid-bg { mask-image:linear-gradient(#0009,transparent 95%); }
.hero .eyebrow::before { animation:mt5-beacon 3.5s ease-in-out infinite; }
.hero-visual { animation:mt5-enter 1.2s var(--motion-ease) both; animation-delay:.15s; }
.hero h1 { animation:mt5-enter 1s var(--motion-ease) both; }
.hero .hero-sub { animation:mt5-enter 1s .12s var(--motion-ease) both; }
.hero-actions { animation:mt5-enter 1s .24s var(--motion-ease) both; }
@keyframes mt5-enter { from { opacity:0; translate:0 22px; } to { opacity:1; translate:0 0; } }
@keyframes mt5-aurora { from { opacity:.65; transform:scale(1) translateX(-2%); } to { opacity:1; transform:scale(1.08) translateX(2%); } }
@keyframes mt5-beacon { 0%,100% { box-shadow:0 0 8px #6aa0ff66; } 50% { box-shadow:0 0 17px #6aa0ffcc; } }
.reveal { transition:opacity .9s var(--motion-ease),transform .9s var(--motion-ease); transform:translateY(32px); }
.step:nth-child(2) { transition-delay:.1s; }
.step:nth-child(3) { transition-delay:.2s; }
.feature,.sec-card,.step,.chart-card { transition:transform .4s var(--motion-ease),border-color .4s,box-shadow .4s,opacity .9s var(--motion-ease); }
@media (hover:hover) and (pointer:fine) {
  .feature:hover,.sec-card:hover,.step.in:hover { transform:translateY(-5px); border-color:#6aa0ff50; box-shadow:0 15px 40px -20px #3d7bff55; }
  .feature:hover .icon-box,.sec-card:hover .icon-box { transform:translateY(-3px); background:#3d7bff20; box-shadow:0 0 22px -9px #6aa0ff80; }
  .chart-card.in:hover { border-color:#6aa0ff50; box-shadow:0 20px 60px -30px #3d7bff55; }
}
.icon-box { transition:transform .4s var(--motion-ease),background .4s,box-shadow .4s; }
.shield-core { animation:mt5-shield-glow 5s ease-in-out infinite; }
@keyframes mt5-shield-glow { 0%,100% { box-shadow:0 20px 60px -10px #3d7bff55; } 50% { box-shadow:0 15px 75px -5px #3d7bff88,0 0 25px #3d7bff20; } }
.nav a { position:relative; transition:color .25s; }
.nav a::after { content:""; position:absolute; height:1px; bottom:-7px; left:0; right:0; background:linear-gradient(90deg,transparent,#6aa0ff,transparent); transform:scaleX(0); transition:transform .35s var(--motion-ease); }
.nav a:hover::after,.nav a:focus-visible::after { transform:scaleX(1); }
.tabs .tab { transition:background .3s,box-shadow .3s,color .3s; }
.tabs .tab.active { box-shadow:inset 0 1px 0 #ffffff12,0 4px 18px #0002; }
.panel.active { animation:mt5-panel .5s var(--motion-ease); }
@keyframes mt5-panel { from { opacity:0; translate:0 10px; } to { opacity:1; translate:0 0; } }
.scroll-progress { position:fixed; inset:0 auto auto 0; height:2px; width:100%; transform:scaleX(0); transform-origin:left; z-index:80; background:linear-gradient(90deg,#3d7bff,#93bdff); box-shadow:0 0 9px #6aa0ff66; pointer-events:none; }
@media (max-width:640px) { .hero::before { animation-duration:20s; } .btn-primary::before,.btn-primary::after { animation-duration:8s; } }
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
  .reveal { opacity:1; transform:none; }
  .btn::before,.btn::after,.scroll-progress { display:none; }
  .btn:hover,.btn:focus-visible { transform:none; }
}