.mt-progress {
  position: fixed; top: 0; left: 0;
  width: 100%; height: 3px;
  transform: scaleX(0); transform-origin: 0 50%;
  background: linear-gradient(90deg, #B8922A 0%, #E7C77F 46%, #A8322D 100%);
  opacity: .9; z-index: 9999; pointer-events: none;
}

html.mt .rv, html.mt .rv-r {
  opacity: 0;
  transition: opacity .95s cubic-bezier(.2,.68,.32,1), transform .95s cubic-bezier(.2,.68,.32,1);
  transition-delay: var(--d, 0ms);
}
html.mt .rv { transform: translate3d(0, 28px, 0); }
html.mt .rv-r { transform: translate3d(36px, 14px, 0); }
html.mt .rv.in, html.mt .rv-r.in { opacity: 1; transform: none; }

html.mt .hero h1 {
  opacity: 0; transform: translateY(16px); letter-spacing: 16px;
  transition: opacity 1.5s ease, transform 1.5s cubic-bezier(.2,.68,.32,1), letter-spacing 1.8s cubic-bezier(.2,.68,.32,1);
}
html.mt .hero h1.in { opacity: 1; transform: none; letter-spacing: 9px; }

html.mt .sec-head .line {
  transform: scaleX(0);
  transition: transform 1.3s cubic-bezier(.2,.68,.32,1) .15s;
}
html.mt .sec-head .line:first-child { transform-origin: 100% 50%; }
html.mt .sec-head .line:last-child { transform-origin: 0 50%; }
html.mt .sec-head.head-on .line { transform: scaleX(1); }

html.mt .nav .nav-item {
  opacity: 0; transform: translateY(-7px);
  transition: opacity .8s ease, transform .8s cubic-bezier(.2,.68,.32,1);
}
html.mt .nav.in .nav-item { opacity: 1; transform: none; }
html.mt .nav .nav-item:nth-child(2) { transition-delay: .07s; }
html.mt .nav .nav-item:nth-child(3) { transition-delay: .13s; }
html.mt .nav .nav-item:nth-child(4) { transition-delay: .19s; }
html.mt .nav .nav-item:nth-child(5) { transition-delay: .25s; }

.nav-item::after {
  content: ""; position: absolute; left: 0; right: 14px; bottom: 23px;
  height: 1.5px; background: currentColor; opacity: .45;
  transform: scaleX(0); transform-origin: 0 50%;
  transition: transform .45s cubic-bezier(.2,.68,.32,1);
}
.nav-item:hover::after { transform: scaleX(1); }

html.mt .hero img.bg { animation: mt-kb 34s cubic-bezier(.2,.35,.3,1) both; }
@keyframes mt-kb { from { transform: scale(1.07); } to { transform: scale(1); } }

html.mt .top-ornament { animation: mt-orn 18s ease-in-out infinite alternate; }
@keyframes mt-orn { from { transform: translateY(0); } to { transform: translateY(6px); } }

html.mt .ritual-swirl, html.mt .swirl, html.mt .corner-swirl {
  animation: mt-sway 12s ease-in-out infinite alternate;
  transform-origin: 50% 35%;
}
@keyframes mt-sway {
  from { transform: rotate(-1.4deg); }
  to { transform: rotate(1.4deg); }
}

html.mt .media-ghost, html.mt .dance-label {
  animation: mt-float 9s ease-in-out infinite;
}
@keyframes mt-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}

html.mt .tl-line { transform: scaleY(0); transform-origin: 50% 0; }
html.mt .timeline.on .tl-line {
  transform: scaleY(1);
  transition: transform 2s cubic-bezier(.35,0,.2,1);
}
html.mt .tl-node { opacity: 0; transform: scale(.35); }
html.mt .timeline.on .tl-node {
  opacity: 1; transform: none;
  transition: opacity .45s ease, transform .68s cubic-bezier(.34,1.56,.64,1);
  transition-delay: var(--d, 0ms);
}

.tl-card, .inst-card, .costume-card, .topic-card, .ritual-card {
  transition: transform .5s cubic-bezier(.2,.68,.32,1), box-shadow .5s ease;
}
.tl-card:hover, .ritual-card:hover, .costume-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 18px 40px rgba(93,40,40,.13);
}
.topic-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(93,40,40,.14);
}
.inst-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 38px rgba(93,40,40,.12);
}

.tl-photo, .gallery-img, .step-photo, .media-img, .inst-photo,
.photo-main, .photo-s1, .photo-s2 {
  transition: transform .8s cubic-bezier(.2,.68,.32,1), filter .55s ease;
}
.tl-photo:hover, .gallery-img:hover, .step-photo:hover, .media-img:hover,
.inst-photo:hover, .photo-main:hover, .photo-s1:hover, .photo-s2:hover {
  transform: scale(1.018);
  filter: brightness(1.05) saturate(1.05);
}

.f-links a { display: inline-block; transition: color .3s ease, transform .3s ease; }
.f-links a:hover { transform: translateX(3px); }

.inst-card.playing .card-icon { animation: mt-beat 1.7s ease-in-out infinite; }
.inst-card.playing .accent {
  background-size: 210% 100%;
  animation: mt-sheen 2.6s linear infinite;
}
@keyframes mt-beat {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}
@keyframes mt-sheen {
  from { background-position: 0 50%; }
  to { background-position: 210% 50%; }
}

.btn-primary, .btn-line { position: relative; overflow: hidden; }
.btn-primary::after, .btn-line::after {
  content: ""; position: absolute; top: 0; left: -120%;
  width: 55%; height: 100%; transform: skewX(-18deg);
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.32), transparent);
  pointer-events: none;
}
.btn-primary:hover::after, .btn-line:hover::after { animation: mt-sweep .9s ease; }
@keyframes mt-sweep { to { left: 135%; } }

.pf-canvas {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  pointer-events: none;
}
html.mt .pf-canvas { animation: mt-kb 34s cubic-bezier(.2,.35,.3,1) both; }
html.mt .hero h1 { z-index: 3; }

@media (prefers-reduced-motion: reduce) {
  html.mt .rv, html.mt .rv-r, html.mt .hero h1 {
    opacity: 1 !important; transform: none !important; letter-spacing: 9px;
  }
  html.mt .nav .nav-item { opacity: 1 !important; transform: none !important; }
  html.mt .sec-head .line { transform: none !important; }
  html.mt .tl-line { transform: none !important; }
  html.mt .tl-node { opacity: 1 !important; transform: none !important; }
  html.mt .hero img.bg, html.mt .top-ornament, html.mt .ritual-swirl,
  html.mt .swirl, html.mt .corner-swirl, html.mt .media-ghost, html.mt .dance-label {
    animation: none !important;
  }
  .pf-canvas { display: none !important; }
}