:root {
  --reveal-bg: #f5f7fb;
  --reveal-ink: #f6f9ff;
  --reveal-blue: #a9b9ff;
  --reveal-muted: rgba(246,249,255,.22);
}

.reveal-text-section {
  position: relative;
  z-index: 1;
  min-height: max(1580px, 250svh);
  overflow: clip;
  isolation: isolate;
  background: var(--reveal-bg);
  color: var(--reveal-ink);
  font-family: var(--font-sans);
}
.reveal-text-section::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 26%, rgba(49,87,255,.08), transparent 30%),
    radial-gradient(circle at 88% 71%, rgba(49,87,255,.055), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.72), transparent 31%, rgba(229,234,242,.44));
}
.reveal-text-section::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: clamp(84px, 11vw, 172px);
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(245,247,251,.96));
}

.reveal-text-atmosphere {
  position: absolute;
  inset: 0;
  z-index: -1;
  overflow: clip;
  pointer-events: none;
}
.reveal-grid {
  position: absolute;
  inset: 0;
  opacity: .11;
  background-image:
    linear-gradient(rgba(6,17,29,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(6,17,29,.07) 1px, transparent 1px);
  background-size: clamp(72px, 8vw, 128px) clamp(72px, 8vw, 128px);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.82), transparent 74%);
}
.reveal-orbit {
  position: absolute;
  border: 1px solid rgba(49,87,255,.18);
  border-radius: 50%;
  transform: rotate(-18deg);
}
.reveal-orbit-one {
  width: min(82vw, 1180px);
  height: min(34vw, 490px);
  top: 22%;
  left: -17vw;
}
.reveal-orbit-two {
  width: min(58vw, 840px);
  height: min(25vw, 360px);
  right: -18vw;
  bottom: 15%;
  border-color: rgba(6,17,29,.12);
  transform: rotate(24deg);
}
.reveal-glow {
  position: absolute;
  width: clamp(220px, 31vw, 480px);
  aspect-ratio: 1;
  border-radius: 50%;
  opacity: .48;
  filter: blur(4px);
  mix-blend-mode: multiply;
}
.reveal-glow-one {
  top: 8%;
  right: 6%;
  background: radial-gradient(circle, rgba(49,87,255,.12), transparent 68%);
}
.reveal-glow-two {
  bottom: 5%;
  left: -8%;
  background: radial-gradient(circle, rgba(111,135,255,.13), transparent 69%);
}

.reveal-text-shell {
  position: relative;
  z-index: 2;
  width: min(100%, var(--content-max));
  min-height: inherit;
  margin-inline: auto;
  padding-inline: var(--gutter);
  padding-block: clamp(18px, 3vw, 38px);
}
.reveal-text-pin {
  position: relative;
  min-height: calc(100svh - clamp(36px, 6vw, 76px));
  padding-block: clamp(118px, 15vh, 190px);
  padding-inline: clamp(24px, 4.2vw, 68px);
  display: grid;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(142,161,255,.28);
  border-radius: 28px;
  background: linear-gradient(122deg, #061321 0%, #0b203b 58%, #142d66 100%);
  box-shadow: 0 26px 60px rgba(7,21,34,.2), inset 0 1px rgba(255,255,255,.08);
}
.reveal-text-pin::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: min(48%, 640px);
  pointer-events: none;
  background: linear-gradient(108deg, rgba(49,87,255,.32), transparent 72%);
}
.reveal-text-pin::after {
  content: "";
  position: absolute;
  right: 7%;
  bottom: 0;
  width: min(32%, 390px);
  height: 2px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(169,185,255,.9));
}
.reveal-text-rule {
  position: absolute;
  top: clamp(72px, 11vh, 124px);
  left: clamp(24px, 4.2vw, 68px);
  width: clamp(42px, 6vw, 88px);
  height: 3px;
  background: var(--reveal-blue);
}
.reveal-text-stage {
  position: relative;
  z-index: 2;
  width: 100%;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 16px;
  gap: clamp(20px, 4vw, 64px);
  align-items: center;
}
.reveal-text-copy {
  width: min(100%, 1200px);
}
.reveal-text-title {
  margin: 0;
  color: var(--reveal-ink);
  font-size: clamp(3.5rem, 9vw, 9.3rem);
  font-weight: 540;
  line-height: .9;
  letter-spacing: -.055em;
}
.reveal-text-title > span:first-child,
.reveal-text-body > span:first-child { display: block; }
.reveal-word {
  display: inline-block;
  opacity: 1;
  transform: translate3d(0, 0, 0);
  will-change: opacity, transform;
}
.reveal-text-title .reveal-word { margin-right: .17em; }
.reveal-text-body {
  max-width: 1170px;
  margin: clamp(40px, 5.2vw, 78px) 0 0;
  color: var(--reveal-ink);
  font-size: clamp(2rem, 4.35vw, 4.8rem);
  font-weight: 420;
  line-height: 1.08;
  letter-spacing: -.025em;
}
.reveal-text-body .reveal-word { margin-right: .23em; }
.reveal-text-body .reveal-word-punctuation {
  margin-right: .17em;
  color: var(--reveal-blue);
}
.reveal-media-pill {
  width: clamp(72px, 9vw, 140px);
  height: clamp(38px, 5vw, 72px);
  margin-left: .08em;
  overflow: hidden;
  border: 3px solid rgba(238,239,236,.76);
  border-radius: 999px;
  display: inline-block;
  vertical-align: .03em;
  background: var(--reveal-blue);
  box-shadow: 0 16px 30px rgba(6,17,29,.14);
  transform: rotate(-5deg) translate3d(0, 0, 0);
  will-change: opacity, transform;
}
.reveal-media-pill img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 36%;
  filter: saturate(.76) contrast(1.06);
}

.reveal-progress {
  position: relative;
  justify-self: end;
  width: 12px;
  height: clamp(132px, 19vh, 196px);
  display: flex;
  justify-content: center;
}
.reveal-progress-track {
  position: relative;
  width: 1px;
  height: 100%;
  display: block;
  background: rgba(246,249,255,.24);
}
.reveal-progress-track::before,
.reveal-progress-track::after {
  content: "";
  position: absolute;
  left: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f6f9ff;
  transform: translateX(-50%);
}
.reveal-progress-track::before { top: 0; }
.reveal-progress-track::after { bottom: 0; opacity: .24; }
.reveal-progress-fill {
  position: absolute;
  inset: 0 auto auto -.5px;
  width: 2px;
  height: 100%;
  display: block;
  background: var(--reveal-blue);
  transform: scaleY(1);
  transform-origin: 50% 0;
  will-change: transform;
}
.reveal-text-section.is-enhanced .reveal-progress-fill { transform: scaleY(0); }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 1099px) {
  .reveal-text-section { min-height: max(1440px, 235svh); }
  .reveal-text-title { font-size: clamp(3.4rem, 10vw, 7rem); }
  .reveal-text-body { font-size: clamp(2.1rem, 5vw, 4.45rem); }
}

@media (max-width: 767px) {
  .reveal-text-section { min-height: max(1160px, 215svh); }
  .reveal-text-pin {
    min-height: calc(100svh - 28px);
    padding-block: 104px 86px;
    padding-inline: 18px;
    border-radius: 20px;
  }
  .reveal-text-rule { top: 78px; left: 18px; width: 42px; }
  .reveal-text-stage {
    grid-template-columns: minmax(0, 1fr) 10px;
    gap: 14px;
  }
  .reveal-text-title {
    font-size: clamp(3.15rem, 13vw, 5.3rem);
    line-height: .84;
  }
  .reveal-text-body {
    margin-top: 38px;
    font-size: clamp(2rem, 8vw, 3.45rem);
    line-height: 1.04;
  }
  .reveal-text-title .reveal-word { margin-right: .14em; }
  .reveal-text-body .reveal-word { margin-right: .18em; }
  .reveal-media-pill {
    width: clamp(58px, 18vw, 84px);
    height: clamp(32px, 9vw, 48px);
    border-width: 2px;
  }
  .reveal-progress { height: clamp(104px, 18vh, 156px); }
}

@media (max-width: 430px) {
  .reveal-text-section { min-height: max(1120px, 205svh); }
  .reveal-text-pin { padding-block: 96px 72px; border-radius: 18px; }
  .reveal-text-title { font-size: clamp(2.85rem, 13.4vw, 4rem); }
  .reveal-text-body { font-size: clamp(1.85rem, 8.2vw, 2.72rem); }
  .reveal-text-rule { top: 70px; left: 18px; }
  .reveal-progress { height: 112px; }
}

@media (max-width: 370px) {
  .reveal-text-section { min-height: max(1040px, 190svh); }
  .reveal-text-pin { padding-block: 86px 50px; border-radius: 16px; }
  .reveal-text-rule { top: 60px; left: 16px; width: 34px; }
  .reveal-text-title {
    font-size: clamp(2.45rem, 12vw, 3.1rem);
    line-height: .88;
  }
  .reveal-text-body {
    margin-top: 24px;
    font-size: clamp(1.48rem, 7.5vw, 1.75rem);
    line-height: 1.08;
    letter-spacing: -.008em;
  }
  .reveal-text-body .reveal-word { margin-right: .11em; }
  .reveal-media-pill { width: 50px; height: 28px; }
  .reveal-progress { height: 90px; }
}

@media (prefers-reduced-motion: reduce) {
  .reveal-text-section { min-height: 0; }
  .reveal-text-pin { min-height: max(680px, 100svh); }
  .reveal-word,
  .reveal-media-pill,
  .reveal-progress-fill { opacity: 1 !important; transform: none !important; }
  .reveal-progress-fill { background: var(--reveal-blue); }
}
