/*
 * El orquestador v2: todo cuelga de .anim-orquesta2. El cuadro (.o2-frame) mide siempre 800 × 300 y se
 * escala para caber. Aquí solo va el movimiento de ambiente (arcos, músicos, brazos del maestro); los
 * planos, los cortes, la cámara y el recorte van con la Web Animations API en pieza.js.
 */
.anim-orquesta2 { position: relative; width: 800px; max-width: 100%; aspect-ratio: 8 / 3; }
.o2-frame { position: absolute; left: 0; top: 0; width: 800px; height: 300px; transform-origin: 0 0; background: var(--brand, #56CCE6); }
.o2-frame svg { display: block; width: 100%; height: 100%; }
.o2-grain { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: multiply; opacity: 0; }

.anim-orquesta2 .o2-bob { animation: o2-bob 0.9s ease-in-out infinite; animation-delay: var(--d, 0s); }
.anim-orquesta2 .o2-bow { animation: o2-saw 0.45s ease-in-out infinite alternate; animation-delay: var(--d, 0s); }
@keyframes o2-bob { 50% { transform: translateY(-1.5px) rotate(-3deg); } }
@keyframes o2-saw { from { transform: translateX(-8px); } to { transform: translateX(8px); } }

/* El maestro marca el compás (1 s) y el brazo libre acompaña. */
.anim-orquesta2 .o2-beat-upper { animation: o2-beat-upper 1s ease-in-out infinite; }
.anim-orquesta2 .o2-beat-fore { animation: o2-beat-fore 1s ease-in-out infinite; }
.anim-orquesta2 .o2-free-upper { animation: o2-free 2s ease-in-out infinite; }
.anim-orquesta2 .o2-free-fore { animation: o2-free 2s ease-in-out infinite reverse; }
@keyframes o2-beat-upper { 0%, 100% { transform: rotate(-8deg); } 25% { transform: rotate(14deg); } 50% { transform: rotate(-16deg); } 75% { transform: rotate(10deg); } }
@keyframes o2-beat-fore { 0%, 100% { transform: rotate(12deg); } 25% { transform: rotate(-16deg); } 50% { transform: rotate(20deg); } 75% { transform: rotate(-8deg); } }
@keyframes o2-free { 50% { transform: rotate(-14deg); } }

@media (prefers-reduced-motion: reduce) { .anim-orquesta2 * { animation: none !important; } }
.reduce-motion .anim-orquesta2 * { animation: none !important; }