/* Splash page */
.splash-wrap{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px 18px;
}
.splash-inner{
  width:min(980px, 100%);
  text-align:center;
}
.splash-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:18px;
}
.splash-spacer{flex:1}
.splash-logo{
  height:120px;
  width:auto;
  filter: drop-shadow(0 18px 34px rgba(0,0,0,.28));
  animation: logoIn .9s ease both, logoFloat 5s ease-in-out .9s infinite;
  transform-origin:center;
}
@keyframes logoIn{
  from{opacity:0; transform: translateY(10px) scale(.96)}
  to{opacity:1; transform: translateY(0) scale(1)}
}
@keyframes logoFloat{
  0%,100%{transform: translateY(0)}
  50%{transform: translateY(-6px)}
}

.splash-cards{
  display:grid;
  gap:14px;
  justify-items:center;
  margin: 10px 0 18px;
}
.sofia-card{
  width:min(760px, 100%);
  text-align:left;
}
.sofia-head{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}
.sofia-dots{
  display:flex;
  gap:6px;
}
.sofia-dots span{
  width:10px;height:10px;border-radius:50%;
  background:#38b6ff;
  box-shadow: 0 8px 18px rgba(56,182,255,.18);
}
.sofia-name{
  font-weight:950;
  color:#fff;
  font-size:20px;
  letter-spacing:.01em;
}
.splash-cta{
  display:flex;
  justify-content:center;
  gap:12px;
  flex-wrap:wrap;
  margin-top:10px;
}
.splash-note{
  margin-top:10px;
  color: rgba(255,255,255,.72);
  font-weight:700;
}
@media (max-width: 520px){
  .splash-logo{height:96px}
  .sofia-name{font-size:18px}
}