.ab-flow {
  position: relative;
  z-index: 3;
  animation: ab-fade-in 1800ms var(--ease-symmetric) both;
}

@keyframes ab-fade-in {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.ab-stage {
  position: relative;
  padding: 0 calc(var(--gutter) + var(--rail-w)) 0 calc(var(--gutter) + var(--nav-w));
}

.ab-arrival {
  min-height: calc(100 * var(--vh, 1vh));
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 1180px;
}

.ab-eyebrow {
  margin: 0 0 clamp(16px, calc(2.4 * var(--vh, 1vh)), 28px);
  opacity: 0;
  animation: ab-rise 1600ms 900ms var(--ease-decel) forwards;
}

.ab-name {
  margin: 0;
  font-family: var(--font-mark);
  font-weight: 400;
  font-size: clamp(3.2rem, calc(12 * var(--vw, 1vw)), 9.6rem);
  line-height: 0.98;
  letter-spacing: 0.045em;
  color: var(--ink);
  text-shadow: 0 0 80px rgba(190, 220, 255, 0.14);
  opacity: 0;
  animation: ab-rise 2000ms 1100ms var(--ease-decel) forwards;
}

.ab-lede {
  max-width: 46ch;
  margin-top: clamp(34px, calc(5.5 * var(--vh, 1vh)), 64px);
  opacity: 0;
  animation: ab-rise 2000ms 1500ms var(--ease-decel) forwards;
}

.ab-lede p {
  font-size: clamp(1.04rem, calc(1.22 * var(--vw, 1vw)), 1.24rem);
  line-height: 2;
}

.ab-scroll-hint {
  position: absolute;
  bottom: clamp(28px, calc(5 * var(--vh, 1vh)), 58px);
  left: 50%;
  translate: -50% 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  font-family: var(--font-hud);
  font-size: 9px;
  letter-spacing: 0.4em;
  text-indent: 0.4em;
  color: var(--instr-soft);
  opacity: 0;
  animation: ab-rise 1800ms 2400ms var(--ease-decel) forwards;
}

.ab-scroll-hint img {
  width: 14px;
  rotate: 180deg;
  opacity: 0.7;
  animation: ab-nudge 2.6s var(--ease-symmetric) infinite;
}

@keyframes ab-nudge {
  0%, 100% { transform: translateY(0); opacity: 0.45; }
  50%      { transform: translateY(7px); opacity: 0.9; }
}

@keyframes ab-rise {
  from { opacity: 0; transform: translateY(26px); filter: blur(8px); }
  to   { opacity: 1; transform: none; filter: blur(0); }
}

.ab-chapter {
  min-height: calc(120 * var(--vh, 1vh));
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 1180px;
  padding-top: calc(20 * var(--vh, 1vh));
  padding-bottom: calc(20 * var(--vh, 1vh));
}

.ab-chapter-head {
  display: grid;
  grid-template-columns: auto 1fr;
  align-items: baseline;
  column-gap: clamp(14px, calc(2 * var(--vw, 1vw)), 26px);
  margin-bottom: clamp(34px, calc(6 * var(--vh, 1vh)), 68px);
}

.ab-chapter-tag {
  grid-column: 2;
  display: block;
  margin-top: 12px;
  font-size: 9px;
  letter-spacing: 0.36em;
  opacity: var(--hud);
  transition: opacity 700ms var(--ease-standard);
}

.ab-prose {
  max-width: 54ch;
  position: relative;
}

.ab-prose::before {
  content: '';
  position: absolute;
  left: calc(-1 * clamp(16px, calc(2 * var(--vw, 1vw)), 28px));
  top: 4px;
  bottom: 4px;
  width: 1px;
  background: linear-gradient(to bottom, var(--instr-soft), transparent);
  opacity: calc(var(--hud) * 0.7);
  transition: opacity 700ms var(--ease-standard);
}

.ab-chapter .ab-chapter-head,
.ab-chapter .ab-prose p,
.ab-return .ab-chapter-head,
.ab-return .ab-prose p,
.ab-return .ab-exits {
  opacity: 0;
  transform: translateY(22px);
  filter: blur(6px);
  transition: opacity 1100ms var(--ease-decel),
              transform 1100ms var(--ease-decel),
              filter 1100ms var(--ease-decel);
}

.ab-stage.is-visible .ab-chapter-head,
.ab-stage.is-visible .ab-prose p,
.ab-stage.is-visible .ab-exits {
  opacity: 1;
  transform: none;
  filter: blur(0);
}

.ab-stage.is-visible .ab-prose p:nth-child(1) { transition-delay: 180ms; }
.ab-stage.is-visible .ab-prose p:nth-child(2) { transition-delay: 300ms; }
.ab-stage.is-visible .ab-prose p:nth-child(3) { transition-delay: 420ms; }
.ab-stage.is-visible .ab-prose p:nth-child(4) { transition-delay: 540ms; }
.ab-stage.is-visible .ab-exits { transition-delay: 620ms; }

.ab-return {
  min-height: calc(118 * var(--vh, 1vh));
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 1180px;
  padding-top: calc(20 * var(--vh, 1vh));
  padding-bottom: calc(22 * var(--vh, 1vh));
}

.ab-exits {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(18px, calc(3 * var(--vw, 1vw)), 40px);
  margin-top: clamp(48px, calc(8 * var(--vh, 1vh)), 92px);
}

.ab-exits a {
  position: relative;
  font-family: var(--font-hud);
  font-size: 11px;
  letter-spacing: 0.34em;
  text-decoration: none;
  color: var(--instr);
  padding-bottom: 7px;
}

.ab-exits a::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 1px;
  background: var(--instr);
  scale: 0 1;
  transform-origin: left;
  transition: scale var(--dur-slow) var(--ease-decel);
}

.ab-exits a:hover::after {
  scale: 1 1;
}

@media (max-width: 860px) {
  .ab-stage {
    padding: 0 22px;
  }

  .ab-chapter,
  .ab-return {
    min-height: auto;
    padding-top: calc(18 * var(--vh, 1vh));
    padding-bottom: calc(18 * var(--vh, 1vh));
  }

  .ab-prose::before {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ab-eyebrow,
  .ab-name,
  .ab-lede,
  .ab-scroll-hint,
  .ab-chapter .ab-chapter-head,
  .ab-chapter .ab-prose p,
  .ab-return .ab-chapter-head,
  .ab-return .ab-prose p,
  .ab-return .ab-exits {
    opacity: 1;
    transform: none;
    filter: none;
    animation: none;
    transition: none;
  }
}