/* ── 1. Hide hero content during boot ────────────────────────── */
[data-boot] .hero-eyebrow,
[data-boot] .hero-impact,
[data-boot] .hero-abstract,
[data-boot] .hero-bottom-row {
  opacity: 0;
  transform: translateY(10px);
  transition: none !important;
}

/* Name keeps its permanent skewX so there's no snap when boot ends */
[data-boot] .hero-name {
  opacity: 0;
  transform: translateY(10px) skewX(-8deg);
  transition: none !important;
}

[data-boot] .hero-manifest .manifest-rule,
[data-boot] .hero-manifest .manifest-col {
  opacity: 0;
  transform: translateY(8px);
  transition: none !important;
}

/* ── 2. Boot-visible: fade + rise in ─────────────────────────── */
[data-boot] .hero-eyebrow.boot-visible,
[data-boot] .hero-impact.boot-visible,
[data-boot] .hero-abstract.boot-visible,
[data-boot] .hero-bottom-row.boot-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.42s ease, transform 0.42s ease !important;
}

/* Name: fade up with skew preserved throughout — no snap on boot end */
[data-boot] .hero-name.boot-visible {
  opacity: 1;
  transform: translateY(0) skewX(-8deg);
  transition: opacity 0.18s ease, transform 0.18s ease !important;
}

[data-boot] .hero-manifest .manifest-rule.boot-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.35s ease, transform 0.35s ease !important;
}

[data-boot] .hero-manifest .manifest-col.boot-visible {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.38s ease, transform 0.38s cubic-bezier(0.22, 1, 0.36, 1) !important;
}

/* ── 3. Scanner line ──────────────────────────────────────────── */
.hero-boot-scanner {
  position: absolute;
  left:  -6%;
  right: -6%;
  top: -2px;
  height: 2px;
  background: linear-gradient(
    90deg,
    transparent                  0%,
    rgba(124,  58, 237, 0.15)   12%,
    rgba(167, 139, 250, 0.60)   30%,
    rgba(196, 181, 253, 1.00)   50%,
    rgba(167, 139, 250, 0.60)   70%,
    rgba(124,  58, 237, 0.15)   88%,
    transparent                 100%
  );
  box-shadow:
    0 0  8px rgba(167, 139, 250, 0.55),
    0 0 22px rgba(124,  58, 237, 0.28),
    0 0 60px rgba(124,  58, 237, 0.12);
  pointer-events: none;
  z-index: 20;
  opacity: 0;
}

.hero-boot-scanner.active {
  opacity: 1;
  transition: opacity 0.15s ease;
}

.hero-boot-scanner.scanning {
  animation: boot-scan-down 0.60s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}

@keyframes boot-scan-down {
  from { top: -2px; opacity: 1; }
  to   { top: 100%; opacity: 0.5; }
}

/* ── 4. Name shimmer — one soft light sweep after fade-in ────── */
.hero-name.boot-shimmer {
  overflow: hidden;
}

.hero-name.boot-shimmer::before {
  content: '';
  position: absolute;
  inset: -15% 0;
  background: linear-gradient(
    108deg,
    transparent            30%,
    rgba(196, 181, 253, 0.18) 44%,
    rgba(220, 210, 255, 0.32) 50%,
    rgba(196, 181, 253, 0.18) 56%,
    transparent            70%
  );
  transform: translateX(-110%);
  animation: name-shimmer-sweep 0.72s cubic-bezier(0.4, 0, 0.2, 1) forwards;
  pointer-events: none;
}

@keyframes name-shimmer-sweep {
  from { transform: translateX(-110%); }
  to   { transform: translateX(210%); }
}

.hero-boot-scanner.done {
  opacity: 0;
  transition: opacity 0.28s ease;