/* ─── SPLASH ─── */
#splash{
  position:fixed;inset:0;z-index:9999;
  background:var(--navy);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;
  transition:opacity .9s var(--ease),visibility .9s;
}
#splash.hide{opacity:0;visibility:hidden;pointer-events:none}

.sp-wrap{display:flex;flex-direction:column;align-items:center;gap:36px;animation:spIn .8s var(--ease) both}
@keyframes spIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.sp-logo{
  width:110px;height:110px;position:relative;
  animation:spinSlow 8s linear infinite;
}
@keyframes spinSlow{to{transform:rotate(360deg)}}

.sp-name{
  font-family:var(--ff-head);font-size:clamp(26px,4vw,48px);
  font-weight:800;letter-spacing:-1px;color:#fff;text-align:center;
}
.sp-name .it{color:var(--red)}
.sp-name .dot{color:rgba(255,255,255,.4)}
.sp-sub{font-size:13px;letter-spacing:4px;text-transform:uppercase;color:rgba(255,255,255,.4);margin-top:-24px}

.sp-tricolor{
  display:flex;gap:0;border-radius:6px;overflow:hidden;width:200px;height:4px;
}
.sp-tricolor div{flex:1}
.sp-tricolor .tc-b{background:var(--blue-mid)}
.sp-tricolor .tc-w{background:rgba(255,255,255,.9)}
.sp-tricolor .tc-r{background:var(--red)}

.sp-bar-outer{width:220px;height:2px;background:rgba(255,255,255,.1);border-radius:2px;overflow:hidden}
.sp-bar-inner{height:100%;width:0;background:#fff;animation:loadBar 2.4s .5s var(--ease) forwards}
@keyframes loadBar{to{width:100%}}