/* The introduction never owns scroll, focus, or the document's dimensions. */
.ir-intro[hidden] { display: none !important; }
.ir-intro {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: hidden;
  overflow: clip;
  color: #fff;
  isolation: isolate;
  pointer-events: none;
  -webkit-font-smoothing: antialiased;
}
.ir-stage, .ir-backdrop, .ir-shade { position: absolute; inset: 0; }
.ir-backdrop { background: #08182d; }
.ir-mosaic {
  position: absolute;
  inset: -18% -7%;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(9px, 1.1vw, 22px);
  transform: rotate(-7deg) scale(1.04);
  transform-origin: center;
}
.ir-column {
  display: flex;
  flex-direction: column;
  min-width: 0;
  gap: clamp(9px, 1.1vw, 22px);
  align-self: center;
  will-change: transform, opacity;
}
.ir-column:nth-child(even) { margin-top: 15vh; }
.ir-frame {
  position: relative;
  height: 35vh;
  min-height: 140px;
  overflow: hidden;
  border: 1px solid #ffffff1c;
  border-radius: clamp(7px, .8vw, 16px);
  background: #0c2038;
}
.ir-frame-tall { height: 45vh; }
.ir-frame img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 48% 50%;
  opacity: .78;
}
.ir-frame-photo img { object-position: 72% 50%; }
.ir-column-4 .ir-frame-tall img { object-position: 22% 50%; }
.ir-shade {
  background: linear-gradient(180deg, #08182d8a, #08182d22 24%, #08182d22 76%, #08182d9e),
    radial-gradient(ellipse at 50% 49%, #08182ddc 0%, #08182dbb 30%, #08182d2e 68%, #08182d16 100%);
}
.ir-brand {
  position: absolute;
  top: max(30px, env(safe-area-inset-top));
  left: clamp(24px, 4vw, 76px);
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 25px;
  font-weight: 650;
  letter-spacing: -.065em;
}
.ir-brand img { width: 32px; height: 32px; object-fit: contain; }
.ir-heading {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  padding: 0 24px 12px;
  transform: translateY(-50%);
  text-align: center;
  font-size: clamp(66px, 9.4vw, 178px);
  font-weight: 560;
  line-height: .99;
  letter-spacing: -.073em;
}
.ir-heading-line { overflow: hidden; padding: .08em .12em .12em; margin: -.04em 0; }
.ir-heading-line > span { display: block; will-change: transform, opacity; }
.ir-heading em { color: #64a8ff; font-style: normal; }
.ir-caption {
  position: absolute;
  bottom: max(38px, env(safe-area-inset-bottom));
  left: clamp(24px, 4vw, 76px);
  display: flex;
  align-items: center;
  gap: 13px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: #ecf3ffb3;
}
.ir-caption i { width: 22px; height: 1px; background: #ecf3ff60; }
.ir-skip {
  position: absolute;
  right: clamp(24px, 4vw, 76px);
  bottom: max(24px, env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  gap: 20px;
  min-height: 44px;
  padding: 0 0 0 12px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #f5f8ff;
  font: inherit;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: -.01em;
  cursor: pointer;
  pointer-events: auto;
  -webkit-tap-highlight-color: transparent;
}
.ir-skip span { font-size: 20px; font-weight: 300; }
.ir-skip:focus-visible { outline: 2px solid #7cb6ff; outline-offset: 7px; }
.ir-progress { position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background: #ffffff0d; }
.ir-progress span { display: block; width: 100%; height: 100%; background: #056bff; transform: scaleX(0); transform-origin: left; }
.ir-intro[data-ir-state="preparing"] .ir-progress {
  bottom: 29%; left: 50%; width: min(260px, 40vw); height: 3px;
  transform: translateX(-50%); border-radius: 4px; overflow: hidden;
  background: #ffffff26;
}
@media (min-width: 2000px) {
  .ir-heading { font-size: 9vw; }
}
@media (max-width: 1000px) {
  .ir-mosaic { grid-template-columns: repeat(4, minmax(0, 1fr)); inset-inline: -12%; }
  .ir-column-1, .ir-column-6 { display: none; }
  .ir-heading { font-size: clamp(66px, 11vw, 112px); }
}
@media (max-width: 600px) {
  .ir-mosaic { grid-template-columns: repeat(3, minmax(0, 1fr)); inset: -14% -24%; gap: 10px; transform: rotate(-8deg) scale(1.02); }
  .ir-column { gap: 10px; }
  .ir-column-5 { display: none; }
  .ir-frame { height: 33vh; min-height: 140px; }
  .ir-frame-tall { height: 43vh; }
  .ir-heading { padding-inline: 12px; font-size: clamp(43px, 12vw, 72px); }
  .ir-brand { top: max(24px, env(safe-area-inset-top)); left: 22px; font-size: 23px; }
  .ir-brand img { width: 29px; height: 29px; }
  .ir-caption { left: 22px; bottom: 84px; gap: 10px; font-size: 8px; }
  .ir-caption i { width: 17px; }
  .ir-skip { right: 22px; bottom: max(20px, env(safe-area-inset-bottom)); }
}
@media (max-height: 480px) and (min-width: 601px) {
  .ir-heading { font-size: clamp(56px, 16vh, 84px); }
  .ir-brand { top: 16px; }
  .ir-caption { bottom: 24px; }
  .ir-skip { bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  .ir-intro { display: none !important; }
}