/* === Sistema de transições Exceder === */

/* Common */
body.is-leaving .page,
body.is-leaving .home,
body.is-leaving .page-stage,
body.is-leaving .editorial { will-change: clip-path, transform, opacity; }

/* Static overlay elements (z-index ordered) */
.t-bar { position: fixed; left: 0; right: 0; background: #0a0e14; z-index: 9998; pointer-events: none; }
.t-bar-top { top: 0; height: 0; }
.t-bar-bottom { bottom: 0; height: 0; }
.t-curtain { position: fixed; inset: 0; background: linear-gradient(to bottom, #0a0e14 0%, #14191f 100%); transform: translateY(-100%); z-index: 9997; pointer-events: none; border-bottom: 2px solid #d4b981; }
.t-diagonal { position: fixed; inset: 0; background: #0a0e14; clip-path: polygon(100% 0%, 100% 0%, 100% 0%, 100% 0%); z-index: 9996; pointer-events: none; }
.t-sweep { position: fixed; inset: 0; background: linear-gradient(90deg, transparent 0%, transparent 30%, #d4b981 50%, transparent 70%, transparent 100%); transform: translateX(-100%); z-index: 9995; pointer-events: none; }

/* === 1. IRIS === */
body.t-iris-leave .leave-overlay {
  background: radial-gradient(circle at var(--cx, 50%) var(--cy, 50%), #d4b981 0%, #d4b981 60%, transparent 100%);
  clip-path: circle(0 at var(--cx, 50%) var(--cy, 50%));
  animation: iris-leave 0.45s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
body.t-iris-enter .leave-overlay {
  background: radial-gradient(circle at 50% 50%, #d4b981 0%, #d4b981 60%, transparent 100%);
  clip-path: circle(160% at 50% 50%);
  animation: iris-enter 0.35s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
@keyframes iris-leave {
  to { clip-path: circle(160% at var(--cx, 50%) var(--cy, 50%)); }
}
@keyframes iris-enter {
  to { clip-path: circle(0 at 50% 50%); }
}

/* === 2. LETTERBOX === */
body.t-letterbox-leave .t-bar-top { animation: lb-top-leave 0.4s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
body.t-letterbox-leave .t-bar-bottom { animation: lb-bot-leave 0.4s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
body.t-letterbox-enter .t-bar-top { height: 50vh; animation: lb-top-enter 0.35s cubic-bezier(0.33, 1, 0.68, 1) forwards; }
body.t-letterbox-enter .t-bar-bottom { height: 50vh; animation: lb-bot-enter 0.35s cubic-bezier(0.33, 1, 0.68, 1) forwards; }
@keyframes lb-top-leave { to { height: 50vh; } }
@keyframes lb-bot-leave { to { height: 50vh; } }
@keyframes lb-top-enter { to { height: 0; } }
@keyframes lb-bot-enter { to { height: 0; } }

/* === 3. CURTAIN === */
body.t-curtain-leave .t-curtain { animation: curtain-down 0.4s cubic-bezier(0.33, 1, 0.68, 1) forwards; }
body.t-curtain-enter .t-curtain { transform: translateY(0); animation: curtain-up 0.35s cubic-bezier(0.4, 0, 0.68, 1) forwards; }
@keyframes curtain-down { to { transform: translateY(0); } }
@keyframes curtain-up { to { transform: translateY(100%); } }

/* === 4. DIAGONAL === */
body.t-diagonal-leave .t-diagonal { animation: diag-leave 0.35s linear forwards; }
body.t-diagonal-enter .t-diagonal { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); animation: diag-enter 0.3s linear forwards; }
@keyframes diag-leave { to { clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%); } }
@keyframes diag-enter { to { clip-path: polygon(100% 100%, 100% 100%, 100% 100%, 100% 100%); } }

/* === 5. ZOOM + CROSSFADE === */
body.t-zoom-leave .page,
body.t-zoom-leave .home,
body.t-zoom-leave .page-stage,
body.t-zoom-leave .editorial { animation: zoom-leave 0.45s cubic-bezier(0.33, 1, 0.68, 1) forwards; }
body.t-zoom-enter .page,
body.t-zoom-enter .home,
body.t-zoom-enter .page-stage,
body.t-zoom-enter .editorial { animation: zoom-enter 0.4s cubic-bezier(0.33, 1, 0.68, 1) forwards; }
@keyframes zoom-leave { to { transform: scale(0.94); opacity: 0; } }
@keyframes zoom-enter { from { transform: scale(1.04); opacity: 0; } to { transform: scale(1); opacity: 1; } }

/* === 6. LIGHT SWEEP === */
body.t-sweep-leave .t-sweep { animation: sweep-across 0.4s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
body.t-sweep-leave .page,
body.t-sweep-leave .home,
body.t-sweep-leave .page-stage,
body.t-sweep-leave .editorial { animation: sweep-fade-out 0.4s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
body.t-sweep-enter .page,
body.t-sweep-enter .home,
body.t-sweep-enter .page-stage,
body.t-sweep-enter .editorial { animation: sweep-fade-in 0.35s cubic-bezier(0.65, 0, 0.35, 1) forwards; }
@keyframes sweep-across { to { transform: translateX(100%); } }
@keyframes sweep-fade-out { to { opacity: 0; } }
@keyframes sweep-fade-in { from { opacity: 0; } to { opacity: 1; } }