/* AegisLand motion + hero stability layer.
   Presentation only: keeps the animation work while removing the glass-material redesign. */
:root{
  --motion-line:rgba(23,26,32,.12);
  --motion-muted:#6b6d70;
  --motion-ink:#171a20;
  --motion-accent:#3e6ae1;
}

/* Keep the original solid UI language. This layer intentionally does NOT
   override buttons, navigation, cards, headers, or menus with translucent
   surfaces, backdrop blur, refraction, or frosted shadows. */

/* Stable two-column phase hero composition. */
.hero.scene-hero{
  grid-template-columns:minmax(320px,1.05fr) minmax(360px,.95fr)!important;
  gap:clamp(28px,5vw,72px)!important;
  align-items:center!important;
  min-height:clamp(620px,86svh,820px)!important;
  padding-top:clamp(108px,11vw,138px)!important;
  padding-bottom:96px!important;
  overflow:hidden!important;
}
.scene-hero .hero-copy{
  max-width:650px!important;
  position:relative!important;
  z-index:4!important;
}
.scene-hero .hero-scene{
  width:min(100%,600px)!important;
  max-width:600px!important;
  height:auto!important;
  min-height:0!important;
  aspect-ratio:4/3!important;
  padding:22px!important;
  justify-self:end!important;
  align-self:center!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  gap:12px!important;
  position:relative!important;
  isolation:isolate!important;
  contain:layout paint style!important;
  overflow:hidden!important;
  transform:none!important;
}
.scene-hero .scene-label,.scene-hero .scene-foot{
  position:relative!important;
  inset:auto!important;
  z-index:6!important;
  width:100%!important;
  margin:0!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:18px!important;
  align-items:start!important;
  pointer-events:none!important;
}
.scene-hero .scene-label{
  padding:0 0 12px!important;
  border-bottom:1px solid var(--motion-line)!important;
}
.scene-hero .scene-foot{
  padding:12px 0 0!important;
  border-top:1px solid var(--motion-line)!important;
  align-items:end!important;
}
.scene-hero .scene-label span,.scene-hero .scene-foot span{
  position:static!important;
  transform:none!important;
  display:block!important;
  font-size:9px!important;
  line-height:1.35!important;
  letter-spacing:.15em!important;
  text-transform:uppercase!important;
  color:var(--motion-muted)!important;
}
.scene-hero .scene-label strong,.scene-hero .scene-foot strong{
  position:static!important;
  inset:auto!important;
  display:block!important;
  place-items:initial!important;
  width:auto!important;
  height:auto!important;
  transform:none!important;
  margin:0!important;
  font-size:11px!important;
  line-height:1.4!important;
  letter-spacing:0!important;
  text-transform:none!important;
  text-align:right!important;
  font-weight:600!important;
  color:var(--motion-ink)!important;
}
.scene-hero .scene-svg{
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  align-self:stretch!important;
  position:relative!important;
  z-index:1!important;
}
/* Human-readable labels stay outside moving SVG geometry. */
.scene-hero .scene-svg text{display:none!important}
.scene-hero .p7-stage{
  position:relative!important;
  min-height:0!important;
  height:100%!important;
  overflow:hidden!important;
}
.scene-hero .p7-stage .scene-svg{
  position:absolute!important;
  inset:0!important;
}

/* Keep the animation pacing the user liked. */
.p1-drone{animation-duration:6.8s!important}
.p1-shield{animation-duration:5.2s!important}
.p2-window{animation-duration:7.2s!important}
.p3-pulse{animation-duration:4.8s!important}
.p5-tunnel{animation-duration:7s!important}
.p5-particles circle{animation-duration:5.2s!important}
.p6-lock{animation-duration:4.6s!important}
.p6-scan{animation-duration:5.4s!important}
.p6b-lane .shutter{animation-duration:5.2s!important}
.p7-cube{animation-duration:9s!important}
.p7-hot circle{animation-duration:4.2s!important}
.p8-deltas line{animation-duration:4.6s!important}
.p8-word{display:none!important}
.p9-lock{animation-duration:4.2s!important}
.p9-geo .estimate{animation-duration:5.4s!important}
.p10-band{animation-duration:5.6s!important}
.p10-kalman rect{animation-duration:5.4s!important}
.p10r-cloud.tail circle{animation-duration:5.6s!important}
.p10r-arrow{animation-duration:5s!important}

/* Preserve distinct motion signatures without applying glass backgrounds. */
.hero-scene-phase1 .p1-bad{opacity:.50!important}
.hero-scene-phase1 .p1-safe{stroke:var(--motion-accent)!important}
.hero-scene-phase1 .p1-shield{fill:rgba(62,106,225,.06)!important;stroke:var(--motion-accent)!important}
.hero-scene-phase7{overflow:hidden!important}
.hero-scene-phase7 .p7-cube path{stroke:rgba(23,26,32,.34)!important}
.hero-scene-phase7 .p7-hot circle{fill:var(--motion-accent)!important}
.hero-scene-phase10 .p10-path{stroke:#252a35!important}
.hero-scene-phase10 .p10-band{stroke:rgba(62,106,225,.64)!important}
.hero-scene-phase10 .p10-state circle{fill:var(--motion-accent)!important}
.hero-scene-phase10 .p10-kalman rect{fill:#fff!important;stroke:rgba(62,106,225,.28)!important}
.hero-scene-phase10r .p10r-band{fill:rgba(62,106,225,.06)!important;stroke:rgba(62,106,225,.34)!important}
.hero-scene-phase10r .p10r-mid{stroke:rgba(23,26,32,.14)!important}
.hero-scene-phase10r .p10r-cloud.good circle{fill:rgba(62,106,225,.86)!important}
.hero-scene-phase10r .p10r-cloud.tail circle{fill:#fff!important;stroke:#202631!important}
.hero-scene-phase10r .p10r-shift{stroke:rgba(62,106,225,.66)!important}
.hero-scene-phase10r .p10r-arrow{stroke:rgba(62,106,225,.72)!important}

/* All 12 phases remain visible. Styling stays flat and solid. */
.phase-rail-section{
  overflow-x:auto!important;
  padding-top:18px!important;
  padding-bottom:18px!important;
}
.phase-rail{
  grid-template-columns:repeat(12,minmax(78px,1fr))!important;
  gap:8px!important;
  min-width:1040px!important;
  min-height:112px!important;
  padding:8px!important;
}
.rail-step{
  padding:14px 12px!important;
  opacity:.76!important;
}
.rail-step:hover,.rail-step.active{opacity:1!important}
.rail-step>i{background:rgba(23,26,32,.12)!important}
.rail-step.active>i,.rail-step.frontier>i{background:var(--motion-accent)!important}

/* Homepage: keep the restrained animated field that replaced the giant target,
   but use an opaque, non-glass surface. */
.hero-media{
  isolation:isolate!important;
  overflow:hidden!important;
  background:#f4f5f7!important;
  border:1px solid rgba(23,26,32,.08)!important;
  box-shadow:none!important;
}
.hero-media::before,.hero-media::after{
  content:"";
  position:absolute;
  pointer-events:none;
  z-index:0;
}
.hero-media::before{
  width:46%;
  aspect-ratio:1;
  border-radius:50%;
  right:8%;
  top:10%;
  border:1px solid rgba(62,106,225,.18);
  box-shadow:0 0 0 44px rgba(62,106,225,.025),0 0 0 88px rgba(62,106,225,.018);
  animation:motionOrbit 14s linear infinite;
}
.hero-media::after{
  left:10%;
  right:10%;
  bottom:18%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(62,106,225,.34),transparent);
  animation:motionScan 10s ease-in-out infinite;
}
.hero-media .hero-image{
  position:relative!important;
  z-index:1!important;
  opacity:.055!important;
  filter:grayscale(1) contrast(.78)!important;
  transform:scale(.70) rotate(-3deg)!important;
  transform-origin:center!important;
  object-fit:contain!important;
  padding:10%!important;
}
.hero-reticle,.hero-telemetry,.hero-media figcaption{z-index:2!important}
.hero-reticle{opacity:.48!important;transform:scale(.86)!important}

/* Homepage progression keeps the subtle living animation, without blur/frosting. */
#homeModelRail{
  position:relative!important;
  isolation:isolate!important;
  overflow:hidden!important;
  background:#fff!important;
  border-color:rgba(23,26,32,.08)!important;
}
#homeModelRail::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:38vw;
  height:38vw;
  min-width:360px;
  min-height:360px;
  border-radius:50%;
  right:-10vw;
  top:-28vw;
  background:radial-gradient(circle,rgba(62,106,225,.10),transparent 67%);
  animation:motionFloat 12s ease-in-out infinite;
}
#homeModelRail::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:5%;
  right:5%;
  bottom:14px;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(62,106,225,.28),transparent);
  animation:motionScan 11s ease-in-out infinite;
}
#homeModelRail a{
  transition:transform .22s ease,color .22s ease,background .22s ease!important;
}
#homeModelRail a:hover{
  transform:translateY(-2px)!important;
  color:#2345b7!important;
}

@keyframes motionFloat{
  0%,100%{transform:translate3d(0,0,0)}
  50%{transform:translate3d(-18px,12px,0)}
}
@keyframes motionScan{
  0%,100%{opacity:.28;transform:translateX(-5%)}
  50%{opacity:.72;transform:translateX(5%)}
}
@keyframes motionOrbit{
  to{transform:rotate(360deg)}
}

@media(max-width:980px){
  .hero.scene-hero{
    grid-template-columns:1fr!important;
    gap:32px!important;
    min-height:auto!important;
    padding-top:112px!important;
    padding-bottom:84px!important;
  }
  .scene-hero .hero-scene{
    justify-self:center!important;
    width:min(100%,650px)!important;
  }
  .scene-hero .scene-label,.scene-hero .scene-foot{
    grid-template-columns:1fr!important;
    gap:5px!important;
  }
  .scene-hero .scene-label strong,.scene-hero .scene-foot strong{text-align:left!important}
  .phase-rail{min-width:980px!important}
  .hero-media .hero-image{transform:scale(.62) rotate(-3deg)!important;padding:15%!important}
}
@media(max-width:640px){
  .scene-hero .hero-scene{padding:18px!important;aspect-ratio:1.08!important}
  #homeModelRail{padding-inline:18px!important}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
