.closing{
  --mx:65%;
  --my:45%;
  isolation:isolate;
  background:linear-gradient(135deg,#153fef 0%,#284fff 48%,#1240e8 100%);
  padding-bottom:28px
}
.closing:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background-image:linear-gradient(#bed1ff12 1px,transparent 1px),linear-gradient(90deg,#bed1ff12 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(145deg,transparent 12%,#000 75%);
  transform:translate3d(calc((var(--px,0))*-9px),calc((var(--py,0))*-9px),0);
  transition:transform .5s ease-out
}
.closing:after{
  content:"";
  position:absolute;
  inset:-20%;
  z-index:0;
  pointer-events:none;
  background:radial-gradient(ellipse at var(--mx) var(--my),#7aabff52,transparent 38%),radial-gradient(ellipse at 10% 110%,#051f9166,transparent 65%);
  transition:opacity .6s
}
.closing-top,.closing>p{
  z-index:3;
  position:relative
}
.closing-word.block-word{
  position:relative;
  width:100%;
  aspect-ratio:4.2;
  height:auto;
  margin:65px 0 0;
  line-height:1;
  z-index:2;
  overflow:visible;
  touch-action:pan-y;
  user-select:none
}
.block-word canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none
}
.block-word-fallback{
  position:absolute;
  inset:0;
  font-size:22vw;
  font-weight:800;
  letter-spacing:-.08em;
  white-space:nowrap;
  line-height:1.1;
  transition:opacity .35s
}
.block-word.is-ready .block-word-fallback{
  opacity:0
}
.footer-motion-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-top:24px;
  border-top:1px solid #c6d6ff40;
  position:relative;
  z-index:3;
  font:9px/1.8 ui-monospace,Consolas,monospace;
  letter-spacing:.1em;
  color:#c9d6ffb0
}
.footer-motion-meta .motion-note{
  display:flex;
  align-items:center;
  gap:8px
}
.motion-note:before{
  content:"";
  width:4px;
  height:4px;
  background:#cfddff;
  box-shadow:0 0 10px #c4d7ff;
  border-radius:50%
}
.footer-motion-meta button{
  font:inherit;
  letter-spacing:inherit;
  color:inherit;
  display:flex;
  align-items:center;
  gap:8px;
  padding:5px 0;
  background:none;
  border-bottom:1px solid transparent
}
.footer-motion-meta button:hover{
  color:#fff;
  border-bottom-color:#d0ddff
}
.footer-motion-meta button:focus-visible{
  outline-color:#fff
}
.closing.is-motion-paused .motion-note:before{
  box-shadow:none;
  opacity:.45
}
footer{
  background:#1238d2
}
.logo img{
  display:block;
  width:136px;
  height:auto;
  max-width:100%
}
.terminal-head .logo img{
  width:108px
}
.closing-brand-static{
  display:block;
  width:100%;
  height:auto
}
.closing-word:not(.block-word){
  font-size:0;
  letter-spacing:0;
  margin-left:0;
  margin-right:0
}
.block-word-fallback{
  font-size:0;
  letter-spacing:0
}
.block-word-fallback img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block
}
@media(max-width:720px){
  .closing{
    padding-bottom:25px
  }
  .closing-word.block-word{
    margin:38px 0 10px;
    aspect-ratio:3.65
  }
  .block-word-fallback{
    font-size:21vw;
    top:12px
  }
  .footer-motion-meta{
    font-size:8px;
    letter-spacing:.04em;
    padding-top:16px
  }
  .footer-motion-meta .motion-hint{
    display:none
  }
  .closing:before{
    background-size:32px 32px
  }
}
@media(max-width:720px){
  header .logo img{
    width:119px
  }
  .block-word-fallback{
    font-size:0;
    top:0
  }
}
@media(prefers-reduced-motion:reduce){
  .closing:before{
    transform:none
  }
  .block-word-fallback{
    transition:none
  }
}
@media(max-width:720px){
  .hero h1{
    font-size:14vw
  }
}
