/* AeroShards is a React island; these styles only reshape the existing home view. */
#home.hero.page-view {
  overflow-x: hidden;
  overflow-y: auto;
  isolation: isolate;
  background: #120f17;
  color: #f8f5ff;
}
#home.hero::before { display: none; }
#home.hero::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: auto;
  height: auto;
  background: radial-gradient(ellipse 50% 62% at 50% 46%, rgba(18,15,23,.78), rgba(18,15,23,.36) 68%, transparent 100%);
  pointer-events: none;
}
#home .hero-aero {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: radial-gradient(ellipse at 54% 40%, #4c315f 0%, #211728 45%, #120f17 80%);
  pointer-events: none;
}
#home .hero-inner {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 100%;
  height: auto;
  padding-block: clamp(44px, 7vh, 88px);
  text-align: center;
}
#home .hero-copy { width: 100%; max-width: 1050px; }
#home .hero-badge {
  border-color: rgba(192,151,241,.32);
  background: rgba(60,38,78,.44);
  color: #e5d8f4;
  font-size: 11px;
  letter-spacing: .04em;
}
#home .hero-badge i { color: #d6a2ff; }
#home.hero h1 {
  max-width: none;
  margin: clamp(24px, 4.5vh, 42px) auto clamp(17px, 3vh, 26px);
  color: #fcfaff;
  font-size: clamp(36px, 4.4vw, 64px);
  line-height: 1.16;
  letter-spacing: -.035em;
  text-shadow: 0 2px 32px rgba(18,15,23,.6);
  text-wrap: balance;
}
#home .hero-title-line { white-space: normal; }
#home .accent-text { color: #d5a1ff; }
#home .hero-lead {
  max-width: 740px;
  margin-inline: auto;
  color: #ded7e8;
  font-size: clamp(14px, 1.35vw, 17px);
  line-height: 1.8;
  text-shadow: 0 1px 18px rgba(18,15,23,.65);
}
#home .hero-stats {
  width: min(760px, 100%);
  gap: 24px;
  margin: clamp(34px, 6vh, 62px) auto 0;
  padding-top: 26px;
  border-color: rgba(224,202,247,.25);
}
#home .hero-stat strong { color: #f8f5ff; }
#home .hero-stat span { color: #c4b7d2; }
#home .hero-beam {
  width: min(760px, 100%);
  margin: clamp(25px, 5vh, 52px) auto 0;
  background: linear-gradient(90deg, transparent, #896abd 25%, #a855f7 50%, #896abd 75%, transparent);
  box-shadow: 0 0 22px rgba(168,85,247,.45);
  transform-origin: center;
}
body.aero-home-active .site-nav {
  --primary: #f8f5ff;
  --secondary: #ded4e9;
  --tertiary: #b9a9c9;
  --muted: #ded4e9;
  --text: #f8f5ff;
  --line: rgba(235,215,255,.16);
  --line-strong: rgba(235,215,255,.29);
  --surface: #30233b;
  --surface-hover: #3b2d48;
  --nav-menu: rgba(28,20,35,.98);
  --nav-hover: rgba(235,215,255,.13);
  --nav-child: #241b2d;
  --nav-child-hover: #362541;
  border-bottom-color: rgba(235,215,255,.14);
  background: rgba(18,15,23,.84);
}
body.aero-home-active .site-nav .brand-logo {
  filter: brightness(3.25) saturate(.86) contrast(.96) drop-shadow(0 0 1px rgba(255,255,255,.22));
}
@media (max-width: 767px) {
  #home .hero-inner { width: calc(100% - 40px); padding-block: 46px 48px; }
  #home.hero h1 { font-size: clamp(30px, 7vw, 44px); line-height: 1.24; }
  #home .hero-lead { max-width: 100%; font-size: 13px; }
  #home .hero-stats {
    position: static;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px 12px;
    margin-top: 36px;
    padding-top: 22px;
  }
  #home .hero-stat strong { font-size: 23px; }
  #home .hero-stat span { font-size: 11px; }
  #home .hero-beam { position: static; display: block; margin-top: 34px; }
}
@media (max-width: 390px) {
  #home.hero h1 { font-size: 28px; }
  #home .hero-lead br { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  #home .hero-beam { animation: none; transform: none; }
}
