/* The homepage's closing signature has its own type and arrow geometry. */
.footer-finale {
  container-type:inline-size;
  display:grid;
  grid-template-columns:minmax(0,1fr) 19%;
  gap:8%;
  align-items:center;
  position:relative;
  padding:24px 0 36px;
  border-bottom:1px solid var(--line);
}
.finale-type-mask { overflow:clip; padding-block:.08em; }
.finale-type {
  display:block;
  padding-right:.08em;
  font-size:clamp(64px,24cqw,390px);
  font-weight:600;
  line-height:1.06;
  letter-spacing:-.075em;
}
.finale-arrow-space { padding:10%; color:var(--blue); }
.finale-arrow-mask { overflow:clip; aspect-ratio:1; }
.finale-arrow { display:block; width:100%; height:auto; transition:translate .5s var(--ease); }
.footer-finale:hover .finale-arrow { translate:4px -4px; }
.finale-signal { position:absolute; height:1px; width:72px; bottom:-1px; left:0; background:var(--blue); transform-origin:left; }
.footer-finale.is-armed:not(.is-revealed) .finale-type { transform:translateY(115%); }
.footer-finale.is-armed:not(.is-revealed) .finale-arrow-mask { clip-path:inset(100% 0 0 0); }
.footer-finale.is-armed:not(.is-revealed) .finale-signal { transform:scaleX(0); }
.footer-finale.is-revealed .finale-type { animation:finale-type-in 1.2s var(--ease) both; }
.footer-finale.is-revealed .finale-arrow-mask { animation:finale-arrow-in .85s .55s var(--ease) both; }
.footer-finale.is-revealed .finale-signal { animation:finale-signal-in .75s .9s var(--ease) both; }
@keyframes finale-type-in { from { transform:translateY(115%); } to { transform:translateY(0); } }
@keyframes finale-arrow-in { from { clip-path:inset(100% 0 0 0); transform:translate(-7px,7px); } to { clip-path:inset(0); transform:translate(0); } }
@keyframes finale-signal-in { from { transform:scaleX(0); } to { transform:scaleX(1); } }
@media (max-width:767px) {
  .footer-finale { gap:7%; grid-template-columns:minmax(0,1fr) 20%; padding:14px 0 24px; }
  .finale-type { font-size:24cqw; }
  .finale-signal { width:40px; }
  .footer-finale:hover .finale-arrow { translate:2px -2px; }
}
.motion-reduced .footer-finale .finale-type,.motion-reduced .footer-finale .finale-arrow-mask,.motion-reduced .footer-finale .finale-signal { transform:none!important; clip-path:none!important; }
@media (prefers-reduced-motion:reduce) {
  .footer-finale .finale-type,.footer-finale .finale-arrow-mask,.footer-finale .finale-signal { transform:none!important; clip-path:none!important; animation:none!important; }
}
