:root {
  color-scheme: light;
  font-family: "DM Sans", system-ui, sans-serif;
  background: #eef4ff;
  color: #182043;
}

* { box-sizing: border-box; }

html, body { touch-action: manipulation; }
body { min-height: 100dvh; margin: 0; min-width: 320px; overflow-x: hidden; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

.splash-page {
  min-height: 100svh;
  overflow: hidden;
  background: radial-gradient(circle at 12% 5%, #99ddff 0 3%, transparent 22%), linear-gradient(145deg, #f4f7ff 0%, #e9edff 47%, #d6f8ef 100%);
}

.splash-shell {
  position: relative;
  isolation: isolate;
  display: grid;
  min-height: 100dvh;
  place-items: center;
  padding: max(clamp(1.25rem, 5vw, 3.5rem), calc(env(safe-area-inset-top, 0px) + 1.25rem)) max(clamp(1.25rem, 5vw, 3.5rem), calc(env(safe-area-inset-right, 0px) + 1.25rem)) max(clamp(1.25rem, 5vw, 3.5rem), calc(env(safe-area-inset-bottom, 0px) + 1.25rem)) max(clamp(1.25rem, 5vw, 3.5rem), calc(env(safe-area-inset-left, 0px) + 1.25rem));
  transition: opacity .45s ease, transform .45s ease;
}

.splash-shell.is-leaving { opacity: 0; transform: scale(1.025); }

.splash-orb { position: absolute; z-index: -1; border-radius: 999px; filter: blur(2px); opacity: .7; animation: float 7s ease-in-out infinite; }
.orb-one { width: min(38vw, 28rem); height: min(38vw, 28rem); top: -12rem; right: -7rem; background: #7957ef; }
.orb-two { width: min(35vw, 25rem); height: min(35vw, 25rem); bottom: -11rem; left: -8rem; background: #16c8a6; animation-delay: -3.2s; }

.splash-card {
  width: min(100%, 46rem);
  padding: clamp(1.6rem, 5vw, 3.25rem);
  text-align: center;
  border: 1px solid rgba(255, 255, 255, .8);
  border-radius: 2rem;
  background: rgba(255, 255, 255, .79);
  box-shadow: 0 1.5rem 4rem rgba(44, 50, 118, .17);
  backdrop-filter: blur(20px);
  animation: card-in .75s cubic-bezier(.2,.85,.3,1) both;
}

.splash-brand { display: inline-flex; align-items: center; gap: .55rem; color: #2837a5; font-family: Outfit, sans-serif; font-size: clamp(1rem, 2.4vw, 1.25rem); font-weight: 600; }
.splash-brand strong { font-weight: 800; }
.splash-brand-mascot { width: 2.55rem; height: 2.55rem; object-fit: contain; filter: drop-shadow(0 .3rem .45rem rgba(38, 59, 151, .24)); }

.splash-heading { margin: clamp(1.6rem, 5vw, 2.7rem) auto 1.25rem; }
.splash-kicker { margin: 0 0 .65rem; color: #5362bc; font-size: .75rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
h1 { max-width: 34rem; margin: 0 auto; color: #1d255a; font-family: Outfit, sans-serif; font-size: clamp(2.15rem, 7.5vw, 4.3rem); line-height: .98; letter-spacing: -.045em; }
h1 em { color: #23ae8d; font-style: normal; }

.partnership-copy { max-width: 39rem; margin: 0 auto; color: #4d5879; font-size: clamp(.85rem, 2.5vw, 1.03rem); line-height: 1.6; }

.partner-logos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(.45rem, 2vw, 1rem); align-items: stretch; max-width: 35rem; margin: clamp(1.4rem, 4vw, 2.3rem) auto; }
.partner-logo { display: grid; min-height: 4.4rem; margin: 0; place-items: center; overflow: hidden; border: 1px solid #e2e7f5; border-radius: 1rem; background: #fff; box-shadow: 0 .35rem .9rem rgba(46, 60, 126, .06); }
.partner-logo img { display: block; width: 100%; height: 100%; padding: .45rem; object-fit: contain; mix-blend-mode: multiply; }

.splash-progress { display: inline-flex; align-items: center; gap: .5rem; color: #52608e; font-size: .82rem; font-weight: 700; }
.progress-orbit { width: 1.05rem; height: 1.05rem; border: 2px solid #a9b3e5; border-top-color: #3849c5; border-radius: 50%; animation: spin .85s linear infinite; }

@keyframes card-in { from { opacity: 0; transform: translateY(1.5rem) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes float { 50% { transform: translate3d(0, 1.5rem, 0) scale(1.05); } }
@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 430px) {
  .splash-card { border-radius: 1.5rem; }
  .partner-logos { gap: .4rem; }
  .partner-logo { min-height: 3.5rem; border-radius: .7rem; }
  .partner-logo img { padding: .3rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
