/* ================= curtain: opening + page transitions ================= */
.curtain { position: fixed; inset: 0; z-index: 100; pointer-events: none; }
.curtain-panel {
  position: absolute; top: 0; bottom: 0; width: 50.5%;
  background: radial-gradient(120% 90% at 100% 50%, #143a34, var(--green-2) 70%);
  transition: transform .75s cubic-bezier(.77, 0, .18, 1);
}
.curtain-panel.l { left: 0; }
.curtain-panel.r { right: 0; transform-origin: right; background: radial-gradient(120% 90% at 0% 50%, #143a34, var(--green-2) 70%); }
.curtain-mark { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 18px; color: var(--champ); transition: opacity .5s, transform .8s cubic-bezier(.77, 0, .18, 1); }
.curtain-mark img { width: clamp(86px, 10vw, 128px); filter: brightness(0) invert(.88) sepia(.45); opacity: 0; transform: scale(.82) rotate(-8deg); }
.curtain-word { direction: ltr; unicode-bidi: isolate; font-family: "Gloock", serif; font-size: clamp(30px, 4.4vw, 52px); letter-spacing: .02em; overflow: hidden; display: flex; }
.curtain-word span { display: inline-block; transform: translateY(110%); }
.curtain-line { width: min(280px, 60vw); height: 1px; background: linear-gradient(90deg, transparent, var(--gold-hi), transparent); transform: scaleX(0); }

/* default (no JS / reduced motion): no curtain */
.curtain { display: none; }
.curtain-intro .curtain, .curtain-quick .curtain { display: block; }

/* intro: crest, wordmark, line, then the doors open */
.curtain-intro .curtain-mark img { animation: crestIn .8s cubic-bezier(.2, .7, .1, 1) .05s forwards; }
.curtain-intro .curtain-word span { animation: letterUp .8s cubic-bezier(.2, .7, .1, 1) forwards; animation-delay: calc(.25s + var(--i) * .035s); }
.curtain-intro .curtain-line { animation: lineIn .7s cubic-bezier(.77, 0, .18, 1) .55s forwards; }
.curtain-intro .curtain-mark { animation: markOut .45s cubic-bezier(.77, 0, .18, 1) 1.05s forwards; }
.curtain-intro .curtain-panel.l { animation: doorL .85s cubic-bezier(.77, 0, .18, 1) 1.2s forwards; }
.curtain-intro .curtain-panel.r { animation: doorR .85s cubic-bezier(.77, 0, .18, 1) 1.2s forwards; }
/* quick: page arrives with doors closed, opens right away */
.curtain-quick .curtain-mark { display: none; }
.curtain-quick .curtain-panel.l { animation: doorL .7s cubic-bezier(.77, 0, .18, 1) .05s forwards; }
.curtain-quick .curtain-panel.r { animation: doorR .7s cubic-bezier(.77, 0, .18, 1) .05s forwards; }
/* leaving: doors close, then the next page loads */
html.leaving .curtain { display: block; pointer-events: auto; }
html.leaving .curtain-mark { display: none; }
html.leaving .curtain-panel { animation: none !important; transform: translateX(0) !important; }
html.leaving .curtain-panel.l { animation: doorCloseL .55s cubic-bezier(.77, 0, .18, 1) forwards !important; }
html.leaving .curtain-panel.r { animation: doorCloseR .55s cubic-bezier(.77, 0, .18, 1) forwards !important; }
@keyframes crestIn { to { opacity: 1; transform: none; } }
@keyframes letterUp { to { transform: none; } }
@keyframes lineIn { to { transform: scaleX(1); } }
@keyframes markOut { to { opacity: 0; transform: translateY(-18px) scale(.96); } }
@keyframes doorL { to { transform: translateX(-102%); } }
@keyframes doorR { to { transform: translateX(102%); } }
@keyframes doorCloseL { from { transform: translateX(-102%); } to { transform: translateX(0); } }
@keyframes doorCloseR { from { transform: translateX(102%); } to { transform: translateX(0); } }

/* content waits for the doors */
:root { --enter: .15s; }
.curtain-intro { --enter: 1.45s; }
.curtain-quick { --enter: .35s; }

/* ================= drop-in: parts of the page fall into place ================= */
.drop { opacity: 0; }
.drop.dropped { opacity: 1; animation: dropIn .85s cubic-bezier(.22, .9, .3, 1) both; animation-delay: calc(var(--d, 0) * 75ms); }
@keyframes dropIn {
  0% { opacity: 0; transform: translateY(-34px); }
  55% { opacity: 1; transform: translateY(5px); }
  78% { transform: translateY(-2px); }
  100% { opacity: 1; transform: none; }
}
.drop-scale.dropped { animation-name: dropScale; animation-duration: 1s; }
@keyframes dropScale {
  0% { opacity: 0; transform: translateY(-40px) scale(.96); }
  60% { opacity: 1; transform: translateY(6px) scale(1.005); }
  100% { opacity: 1; transform: none; }
}

/* ================= scroll reveals ================= */
.rv { clip-path: inset(0 0 100% 0); transform: translateY(36px); transition: clip-path 1.1s cubic-bezier(.2, .7, .1, 1), transform 1.1s cubic-bezier(.2, .7, .1, 1); transition-delay: calc(var(--i, 0) * 90ms); }
.rv.in { clip-path: inset(-10% -10% -20% -10%); transform: none; }
.rise { opacity: 0; transform: translateY(28px); transition: opacity .9s cubic-bezier(.2, .7, .1, 1), transform .9s cubic-bezier(.2, .7, .1, 1); transition-delay: calc(var(--i, 0) * 110ms); }
.rise.in { opacity: 1; transform: none; }

/* camera-flash burst when the lights go off */
.flashbang { position: absolute; inset: 0; z-index: 3; pointer-events: none; background: radial-gradient(circle at 70% 45%, #fff, rgb(255 255 255 / .6) 40%, transparent 75%); opacity: 0; }
.flashbang.go { animation: flashbang .7s ease-out; }
@keyframes flashbang { 0% { opacity: 0; } 12% { opacity: .95; } 100% { opacity: 0; } }