/* Homepage-only scene; no selectors target shared functional states. */
.home-hero.spirit-hero {
  display: flex; align-items: center; min-height: clamp(650px, 73vh, 780px);
  padding: clamp(26px, 4vw, 60px); gap: 0;
  background: radial-gradient(ellipse at 74% 36%, #fdf7ff 0, transparent 48%), linear-gradient(130deg, #fcf8ff, #eadcf5 62%, #f5e3f1);
}
.spirit-hero .hero-webgl { z-index: 1; opacity: 1; pointer-events: none; }
.spirit-hero .hero-mist {
  z-index: 2; animation: none; mix-blend-mode: normal; pointer-events: none;
  background: linear-gradient(90deg, rgba(252,248,255,.96), rgba(252,248,255,.82) 26%, transparent 49%), linear-gradient(0deg, rgba(248,239,251,.8), transparent 24%);
}
.spirit-hero .hero-copy {
  z-index: 3; width: 38%; min-width: 250px; opacity: var(--spirit-copy-opacity, 1);
  transform: translateY(var(--spirit-copy-y, 0px)); transition: none;
}
.spirit-hero .eyebrow { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; }
.spirit-hero h1 { font-size: clamp(58px, 6.8vw, 90px); }
.spirit-hero .hero-desc { font-size: 17px; line-height: 1.85; }
.spirit-hero .hero-actions { align-items: flex-start; }
.spirit-fallback { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.spirit-fallback::before { content: ''; position: absolute; width: 64%; height: 90%; right: -8%; top: 3%; background: radial-gradient(ellipse, #f9f3ff, #cfb8ed55 48%, transparent 70%); }
.spirit-fallback i {
  position: absolute; bottom: 16%; left: 69%; width: 13%; height: 61%;
  border-radius: 90% 15% 80% 20%; transform-origin: 0 100%;
  transform: rotate(calc((var(--ray) - 4) * 17deg));
  border: 1px solid #ffffffa6; background: linear-gradient(0deg, transparent, #fefbff55, #c9aceb22);
}
html[data-webgl='active'] .spirit-fallback { opacity: .24; }
.spirit-hero .hero-fallback-character { display: none; pointer-events: none; }
.spirit-hero.has-character-fallback .hero-fallback-character {
  display: block; position: absolute; right: 1%; bottom: 0; z-index: 1;
  width: 55%; height: 94%; object-fit: contain; opacity: .72;
  filter: drop-shadow(0 0 24px #cdb2e64d);
  mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 83%, transparent);
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 8%, #000 83%, transparent);
}
@media (max-width: 1023px), (pointer: coarse) {
  .home-hero.spirit-hero { min-height: 520px; }
  .spirit-hero .hero-copy { width: min(80%, 520px); }
  .spirit-hero .hero-mist { background: linear-gradient(90deg,#fcf8ffee,#fcf8ff88 65%,transparent); }
  .home-hero.spirit-hero.has-character-fallback { flex-direction: column; align-items: center; }
  .spirit-hero.has-character-fallback .hero-copy { width: 100%; }
  .spirit-hero.has-character-fallback .hero-mist { background: none; }
  .spirit-hero.has-character-fallback .hero-fallback-character {
    position: relative; right: auto; bottom: auto; width: min(100%, 360px);
    height: 280px; flex: 0 0 280px; margin: 12px auto -16px;
  }
}
@media (max-width: 600px) {
  .home-hero.spirit-hero { min-height: 490px; padding: 32px 22px; }
  .spirit-hero .hero-copy { width: 100%; min-width: 0; }
  .spirit-hero .hero-desc { font-size: 16px; }
  .spirit-hero .hero-actions { display: grid; }
  .spirit-fallback { opacity: .6; }
}
@media (prefers-reduced-motion: reduce) {
  .spirit-hero .hero-copy { opacity: 1; transform: none; }
}