/* Hire: a curtain onto the star in 3D, its line passing over it, the star re-cut into the mark, the call
   landing with it. */
.finale_wrap {
  --fi-ink: #120a10; --fi-paper: #f6f3ee; --fi-mauve: #c48fb4; --fi-gutter: clamp(16px, 4vw, 64px);
  position: relative; z-index: 3; margin-top: -100vh; color: var(--fi-ink);
}
.finale_wrap .finale_contain { position: relative; }
.finale_wrap .finale_screen { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; transform: translate3d(0, var(--hold, 0px), 0); touch-action: pan-y; cursor: grab; }
.finale_wrap.is-grab .finale_screen { cursor: grabbing; }
/* one screen until finale.js mounts on the live page (the editor canvas sizes its frame from the page) */
.finale_wrap .finale_track { position: relative; height: 100vh; }
.finale_wrap.is-live .finale_track { height: 320vh; }
.finale_wrap .finale_stage { position: absolute; inset: 0; background: var(--fi-paper); }
.finale_wrap .finale_stage canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.finale_wrap .finale_layer { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.finale_wrap .finale_layer > * { opacity: 0; transform: translateY(18px) scale(1.04); transition: opacity 0.5s, transform 0.7s cubic-bezier(.2, 1.4, .3, 1); }
.finale_wrap.is-hire .finale_layer > * { opacity: 1; transform: none; }
.finale_wrap.is-hire .finale_layer > .finale_line { transition-delay: 0.15s; }
.finale_wrap.is-hire .finale_layer > .finale_cta { transition-delay: 0.3s; pointer-events: auto; }
.finale_wrap .finale_title {
  position: absolute; left: 0; right: 0; top: 10vh; margin: 0; padding: 0 var(--fi-gutter); text-align: center;
  font-family: 'JJ Bodoni', 'Bodoni Moda', serif; font-weight: 900; letter-spacing: -0.035em; line-height: 0.9;
  font-size: clamp(46px, min(8vw, 12vh), 136px); text-shadow: 4px 4px 0 var(--fi-mauve);
}
.finale_wrap .finale_line { position: absolute; left: 0; right: 0; bottom: 24vh; margin: 0 auto; max-width: 32ch; padding: 0 var(--fi-gutter); text-align: center; font-family: 'JJ Cond', sans-serif; font-size: clamp(16px, 1.3vw, 20px); line-height: 1.35; }
.finale_wrap .finale_cta {
  position: absolute; left: 50%; bottom: 13vh; translate: -50% 0; padding: 14px 28px; white-space: nowrap; pointer-events: none;
  background: var(--fi-ink); color: var(--fi-paper); text-decoration: none; border: 3px solid var(--fi-ink); box-shadow: 6px 6px 0 var(--fi-mauve);
  font-family: 'JJ Bodoni', serif; font-weight: 900; font-size: 20px;
}
.finale_wrap .finale_cta:hover, .finale_wrap .finale_cta:focus-visible { background: var(--fi-mauve); color: var(--fi-ink); outline: none; }
.finale_wrap .finale_goes {
  position: absolute; left: 0; right: 0; top: 50%; z-index: 2; margin: 0; padding: 0 var(--fi-gutter); pointer-events: none;
  display: flex; flex-direction: column; align-items: center; transform: translateY(-50%) scale(var(--gs, 1));
  font-family: 'JJ Bodoni', 'Bodoni Moda', serif; font-weight: 900; font-size: clamp(56px, min(12.5vw, 19vh), 236px);
  line-height: 0.92; letter-spacing: -0.045em; color: var(--fi-ink);
}
.finale_wrap .finale_goes_m { display: block; overflow: hidden; padding: 0.04em 0.08em 0.1em; }
.finale_wrap .finale_goes_w { display: block; transform: translate3d(0, var(--y, 105%), 0); }
.finale_wrap .finale_goes_m + .finale_goes_m { margin-left: 1.1em; }
.finale_wrap .finale_spin {
  position: absolute; left: var(--fi-gutter); bottom: clamp(18px, 4vh, 40px); z-index: 3; display: inline-flex; align-items: center; gap: 10px;
  padding: 10px 16px 10px 12px; border: 2px solid var(--fi-ink); border-radius: 999px; background: var(--fi-paper); color: var(--fi-ink);
  font: 600 14px/1 'JJ Cond', sans-serif; letter-spacing: 0.02em; white-space: nowrap; cursor: pointer;
  opacity: 0; translate: 0 10px; transition: opacity 0.5s, translate 0.6s cubic-bezier(.2, 1, .3, 1), background 0.2s, color 0.2s;
}
.finale_wrap .finale_spin svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.finale_wrap.is-spin .finale_spin { opacity: 1; translate: 0 0; }
.finale_wrap.is-turned .finale_spin span { opacity: 0.6; }
.finale_wrap .finale_spin:hover, .finale_wrap .finale_spin:focus-visible { background: var(--fi-ink); color: var(--fi-paper); outline: none; }
.finale_wrap.is-spin .finale_spin svg { animation: finale-turn 3.2s cubic-bezier(.6, 0, .3, 1) infinite; }
@keyframes finale-turn { 0%, 55% { rotate: 0deg; } 100% { rotate: 360deg; } }
@media (prefers-reduced-motion: reduce) { .finale_wrap.is-spin .finale_spin svg { animation: none; } }
/* the Exe.Eyes mark at the head of the footer: assembled by finale.js, leaning to the hand */
.finale_wrap .finale_ee { display: flex; justify-content: flex-start; margin: 0 0 clamp(28px, 5vh, 54px); }
.finale_wrap .finale_ee_a { display: block; width: clamp(150px, 16vw, 230px); outline: none; -webkit-tap-highlight-color: transparent; touch-action: pan-y; }
.finale_wrap .finale_ee_a:focus-visible { outline: 2px solid var(--fi-mauve); outline-offset: 10px; }
.finale_wrap .finale_ee svg { display: block; width: 100%; height: auto; overflow: visible; transform-style: preserve-3d; }
.finale_wrap .finale_ee_p { fill: var(--fi-paper); transform-box: fill-box; transform-origin: center; opacity: 0; }
.finale_wrap .finale_ee_p.is-eye { fill: var(--fi-mauve); }
.finale_wrap .finale_ee_a:hover .finale_ee_p:not(.is-eye) { fill: #fff; }
.finale_wrap .finale_about { margin: 0 0 clamp(22px, 4vh, 36px); max-width: 68ch; font-size: clamp(15px, 1.15vw, 18px); line-height: 1.55; color: rgba(246, 243, 238, 0.88); }
.finale_wrap .finale_credits { position: relative; z-index: 3; padding: clamp(40px, 8vh, 90px) var(--fi-gutter) 40px; background: var(--fi-ink); color: var(--fi-paper); }
.finale_wrap .finale_foot { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 18px 40px; padding-bottom: clamp(28px, 5vh, 54px); margin-bottom: clamp(24px, 4vh, 40px); border-bottom: 2px solid rgba(246, 243, 238, 0.25); }
.finale_wrap .finale_foot_title { grid-column: 1; margin: 0; font-family: 'JJ Bodoni', serif; font-weight: 900; font-size: clamp(54px, 8vw, 140px); line-height: 0.86; letter-spacing: -0.045em; text-shadow: 5px 5px 0 var(--fi-mauve); }
.finale_wrap .finale_foot_n { display: block; margin-bottom: 10px; font-size: 0.16em; letter-spacing: 0; text-shadow: none; color: var(--fi-mauve); }
.finale_wrap .finale_foot_sub { grid-column: 1; margin: 0; max-width: 46ch; font-family: 'JJ Cond', sans-serif; font-size: 16px; line-height: 1.4; color: rgba(246, 243, 238, 0.82); }
.finale_wrap .finale_back { grid-column: 2; grid-row: 1 / span 2; align-self: end; padding: 12px 18px; border: 2px solid var(--fi-paper); color: var(--fi-paper); text-decoration: none; font-family: 'JJ Bodoni', serif; font-weight: 900; font-size: 17px; white-space: nowrap; }
.finale_wrap .finale_back:hover, .finale_wrap .finale_back:focus-visible { background: var(--fi-paper); color: var(--fi-ink); outline: none; }
.finale_wrap .finale_credits_h { margin: 0 0 16px; font-family: 'JJ Bodoni', serif; font-weight: 900; font-size: 20px; }
.finale_wrap .finale_credits_h span { font-family: 'JJ Mincho', serif; color: var(--fi-mauve); margin-right: 10px; }
.finale_wrap .finale_credits_dl { margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px 40px; }
.finale_wrap .finale_credits_row { margin: 0; }
.finale_wrap .finale_credits_k { margin-bottom: 6px; font-size: 13px; font-weight: 600; color: var(--fi-mauve); }
.finale_wrap .finale_credits_v { margin: 0; font-size: 14px; line-height: 1.5; color: rgba(246, 243, 238, 0.8); }
@media (max-width: 1100px) { .finale_wrap .finale_credits_dl { grid-template-columns: 1fr 1fr; } }
@media (max-aspect-ratio: 1/1) {
  .finale_wrap .finale_title { top: 12vh; }
  .finale_wrap .finale_line { bottom: calc(13vh + 86px); }
  .finale_wrap .finale_cta { bottom: 13vh; }
  .finale_wrap .finale_spin { left: 50%; translate: -50% 10px; bottom: 4vh; }
  .finale_wrap.is-spin .finale_spin { translate: -50% 0; }
  .finale_wrap .finale_credits_dl { grid-template-columns: 1fr; gap: 16px; }
  .finale_wrap .finale_foot { grid-template-columns: 1fr; }
  .finale_wrap .finale_back { grid-column: 1; grid-row: auto; justify-self: start; }
}