@font-face {
  font-family: "Orbitron";
  src: url("/assets/fonts/Orbitron%5Bwght%5D.woff2") format("woff2");
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("/assets/fonts/Rajdhani-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("/assets/fonts/Rajdhani-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Rajdhani";
  src: url("/assets/fonts/Rajdhani-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
:root {
  color-scheme: light;
  --font-wordmark: "Orbitron", "Arial Black", Arial, "Helvetica Neue", sans-serif;
  --font-support: "Rajdhani", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  font-family: var(--font-support);
  font-weight: 500;
  color: #102d4b;
  background: #fbfdff;
  font-synthesis: none;
  -webkit-text-size-adjust: 100%;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-inline-size: 0; }
body { background: #fbfdff; }
.splash {
  --mark-size: clamp(2.5rem, 6vw, 5.5rem);
  min-block-size: 100vh;
  min-block-size: 100svh;
  display: grid;
  place-items: center;
  padding: min(5svh, 3rem) clamp(1.25rem, 5vw, 4rem);
  position: relative;
  isolation: isolate;
  overflow: clip;
  background:
    radial-gradient(ellipse 26% 5% at 50% 87%, rgb(139 190 224 / .12), transparent 80%),
    radial-gradient(ellipse 52% 55% at 50% 43%, #fff 28%, rgb(255 255 255 / .92) 60%, transparent 100%),
    linear-gradient(135deg, #f3f8ff, #fff 50%, #f1faff);
}
.splash::before, .splash::after {
  content: "";
  position: absolute;
  z-index: -1;
  pointer-events: none;
  border-radius: 50%;
  filter: blur(2px);
  background: linear-gradient(145deg, rgb(170 200 234 / .20), rgb(186 220 236 / .09) 65%, transparent 90%);
}
.splash::before {
  inline-size: 105vw;
  block-size: 88svh;
  inset-inline-start: -69vw;
  inset-block-start: -23svh;
  transform: rotate(-30deg);
}
.splash::after {
  inline-size: 90vw;
  block-size: 95svh;
  inset-inline-end: -58vw;
  inset-block-end: -27svh;
  transform: rotate(32deg);
  background: linear-gradient(325deg, rgb(159 215 229 / .17), rgb(184 205 235 / .10) 65%, transparent 90%);
}
.splash__content {
  inline-size: min(100%, 64rem);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(.65rem, 2.5svh, 1.75rem);
}
.splash__symbol {
  inline-size: clamp(5.5rem, min(38vw, 30svh), 18rem);
  max-inline-size: 100%;
}
.splash__symbol svg { display: block; inline-size: 100%; block-size: auto; }
.splash__wordmark {
  margin: 0;
  font-family: var(--font-wordmark);
  font-size: min(var(--mark-size), 12vw);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: .13em;
  padding-inline-start: .13em;
}
.splash__tagline {
  max-inline-size: min(100%, 38rem);
  margin: 0;
  color: #52687e;
  font-size: clamp(.75rem, 1.15vw, 1rem);
  font-weight: 500;
  letter-spacing: .20em;
  line-height: 1.65;
  text-wrap: balance;
}
.splash__tagline span { display: block; }
.splash__divider {
  inline-size: clamp(2.25rem, 6vw, 4.5rem);
  block-size: 2px;
  background: linear-gradient(90deg, #102d4b, #218e95);
}
.splash__capabilities {
  max-inline-size: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: .35em clamp(.3rem, 1vw, .85rem);
  margin: 0;
  color: #52687e;
  font-size: clamp(.75rem, 1vw, .875rem);
  font-weight: 600;
  letter-spacing: .16em;
  line-height: 1.6;
}
.splash__capabilities span { display: inline-block; }
.splash--plca .splash__wordmark { letter-spacing: .18em; padding-inline-start: .18em; }
.splash--plca .splash__tagline { letter-spacing: .17em; }
@media (max-width: 600px) {
  .splash {
    background:
      radial-gradient(ellipse 65% 18% at 50% 100%, rgb(181 215 237 / .12), transparent 80%),
      linear-gradient(135deg, #f8fbff, #fff 48%, #f7fcff);
  }
  .splash::before, .splash::after { inline-size: 115vw; block-size: 60svh; opacity: .55; }
  .splash::before { inset-inline-start: -83vw; inset-block-start: -18svh; }
  .splash::after { inset-inline-end: -83vw; inset-block-end: -18svh; }
}
@media (max-height: 500px) {
  .splash { --mark-size: clamp(1.8rem, 10svh, 2.5rem); }
  .splash__content { gap: 2svh; }
  .splash__symbol { inline-size: 20svh; }
}