body{font-family:Arial,Helvetica,sans-serif}

.index-content{
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:17mm 8mm 10mm;
  text-align:center;
}

.sf-still-logo{
  width:32mm;
  height:24mm;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:15mm;
  font-weight:900;
  letter-spacing:-2px;
  text-shadow:
    -2px 0 #ff35c8,
    2px 0 #00e5ff,
    0 0 14px rgba(124,92,255,.8);
}

.rainbow-title{
  margin-top:20mm;
  display:grid;
  gap:8mm;
  font-size:clamp(25px,8vw,42px);
  font-weight:800;
  letter-spacing:3.5mm;
}

.rainbow-line{
  display:flex;
  justify-content:center;
  gap:2.2mm;
}

.rainbow-line span{
  animation:letter-plane 1.8s ease-in-out infinite alternate;
  text-shadow:0 0 5px currentColor;
}

.rainbow-line span:nth-child(1){color:#ff453a}
.rainbow-line span:nth-child(2){color:#ff9f0a;animation-delay:.08s}
.rainbow-line span:nth-child(3){color:#ffd60a;animation-delay:.16s}
.rainbow-line span:nth-child(4){color:#32d74b;animation-delay:.24s}
.rainbow-line span:nth-child(5){color:#40c8e0;animation-delay:.32s}
.rainbow-line:nth-child(2) span:nth-child(1){color:#0a84ff}
.rainbow-line:nth-child(2) span:nth-child(2){color:#5e5ce6}
.rainbow-line:nth-child(2) span:nth-child(3){color:#bf5af2}
.rainbow-line:nth-child(2) span:nth-child(4){color:#ff375f}
.rainbow-line:nth-child(2) span:nth-child(5){color:#ff9f0a}
.rainbow-line:nth-child(2) span:nth-child(6){color:#30d158}
.rainbow-line:nth-child(2) span:nth-child(7){color:#64d2ff}

@keyframes letter-plane{
  from{transform:translateY(0);filter:brightness(.9)}
  to{transform:translateY(-1mm);filter:brightness(1.3)}
}