/* Premium hero constellation — layered on top of the base Grow with ALPA styles */
.hero-visual.constellation-ready{
  height:640px;
  isolation:isolate;
  overflow:visible;
}
.hero-visual.constellation-ready::before{
  content:"";
  position:absolute;
  inset:3% -7% -2%;
  z-index:-3;
  pointer-events:none;
  background:
    radial-gradient(circle at 52% 49%,rgba(255,255,255,.085) 0,rgba(255,255,255,.032) 23%,transparent 58%),
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.22) 0 1px,transparent 1.4px);
  background-size:auto,26px 26px;
  mask-image:radial-gradient(ellipse at center,#000 0 18%,rgba(0,0,0,.84) 42%,transparent 73%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0 18%,rgba(0,0,0,.84) 42%,transparent 73%);
  opacity:.62;
}
.hero-visual.constellation-ready::after{
  content:"";
  position:absolute;
  inset:7% -6% 1%;
  z-index:12;
  pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 44%,rgba(8,9,11,.18) 67%,rgba(8,9,11,.9) 100%);
}
.hero-visual.constellation-ready .hero-panel{
  inset:-7% -11% -8%;
  border:0;
  border-radius:50%;
  z-index:-4;
  background:
    radial-gradient(ellipse at 52% 47%,rgba(255,255,255,.055),transparent 46%),
    radial-gradient(ellipse at 52% 48%,rgba(255,255,255,.018),transparent 68%);
  mask-image:radial-gradient(ellipse at center,#000 0 42%,transparent 76%);
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0 42%,transparent 76%);
}
.hero-visual.constellation-ready .orbital{
  inset:-1% -7% -2%;
  display:block;
  perspective:1300px;
  transform-style:preserve-3d;
  transform-origin:50% 50%;
  will-change:transform;
}
.hero-visual.constellation-ready .orbital::before,
.hero-visual.constellation-ready .orbital::after{display:none}

.core-halo,.core-shield,.orbit-ring,.constellation-star{position:absolute;pointer-events:none}
.core-halo{
  left:50%;top:50%;
  width:430px;height:430px;
  transform:translate(-50%,-50%) translateZ(-5px);
  border-radius:50%;
  z-index:1;
  background:
    radial-gradient(circle,rgba(255,255,255,.15) 0,rgba(255,255,255,.065) 17%,rgba(255,255,255,.022) 37%,transparent 68%);
  filter:blur(3px);
  opacity:.75;
}
.core-halo::after{
  content:"";
  position:absolute;inset:17%;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.055);
  box-shadow:0 0 70px rgba(255,255,255,.045),inset 0 0 50px rgba(255,255,255,.025);
}
.core-shield{
  left:50%;top:50%;
  width:270px;height:270px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  z-index:5;
  background:radial-gradient(circle,rgba(8,9,11,.96) 0 38%,rgba(8,9,11,.74) 56%,transparent 73%);
  filter:blur(2px);
}
.orbit-ring{
  left:50%;top:50%;
  border:1px solid rgba(255,255,255,.105);
  border-radius:50%;
  z-index:2;
  transform-origin:center;
  box-shadow:0 0 30px rgba(255,255,255,.012),inset 0 0 24px rgba(255,255,255,.01);
  mask-image:linear-gradient(90deg,transparent 1%,#000 17%,rgba(0,0,0,.45) 49%,#000 79%,transparent 99%);
  -webkit-mask-image:linear-gradient(90deg,transparent 1%,#000 17%,rgba(0,0,0,.45) 49%,#000 79%,transparent 99%);
}
.ring-a{width:94%;height:39%;transform:translate(-50%,-50%) rotate(-8deg)}
.ring-b{width:76%;height:52%;transform:translate(-50%,-50%) rotate(15deg);border-color:rgba(255,255,255,.075)}
.ring-c{width:58%;height:63%;transform:translate(-50%,-50%) rotate(-28deg);border-color:rgba(255,255,255,.055)}
.orbit-ring::before{
  content:"";
  position:absolute;
  width:5px;height:5px;border-radius:50%;
  top:50%;left:-3px;
  background:rgba(255,255,255,.72);
  box-shadow:0 0 16px rgba(255,255,255,.42);
}

.hero-visual.constellation-ready .hero-mark{
  position:absolute;
  left:50%;top:50%;
  width:318px;height:318px;
  z-index:6;
  margin:-159px 0 0 -159px;
  object-fit:contain;
  animation:none;
  will-change:transform,filter;
  filter:drop-shadow(0 42px 60px rgba(0,0,0,.72)) drop-shadow(0 0 28px rgba(255,255,255,.055));
  transform-origin:50% 50%;
  pointer-events:auto;
}
.hero-visual.constellation-ready .project-chip{
  left:50%;top:50%;right:auto;bottom:auto;
  z-index:4;
  white-space:nowrap;
  padding:10px 14px 10px 12px;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(10,12,15,.68);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
  backdrop-filter:blur(16px) saturate(1.08);
  color:#bfc5cc;
  box-shadow:0 16px 44px rgba(0,0,0,.38),inset 0 1px rgba(255,255,255,.035);
  font-size:10.5px;
  letter-spacing:-.005em;
  will-change:transform,opacity,filter;
  transform-origin:center;
}
.hero-visual.constellation-ready .project-chip::before{
  content:"";
  display:inline-block;
  width:5px;height:5px;
  margin-right:8px;
  border-radius:50%;
  vertical-align:1px;
  background:#eef0f2;
  box-shadow:0 0 12px rgba(255,255,255,.42);
  opacity:.9;
}
.hero-visual.constellation-ready .project-chip strong{font-weight:680;color:#fff}
.hero-visual.constellation-ready .project-chip.depth-back{
  border-color:rgba(255,255,255,.075);
  background:rgba(8,10,12,.45);
}
.hero-visual.constellation-ready .project-chip.depth-front{
  border-color:rgba(255,255,255,.18);
  background:rgba(14,16,20,.78);
  box-shadow:0 22px 60px rgba(0,0,0,.46),0 0 28px rgba(255,255,255,.02),inset 0 1px rgba(255,255,255,.05);
}
.constellation-star{
  left:var(--x);top:var(--y);
  width:var(--s);height:var(--s);
  border-radius:50%;
  z-index:0;
  opacity:var(--o);
  background:#f3f5f7;
  box-shadow:0 0 10px rgba(255,255,255,.28);
  animation:constellationTwinkle var(--d) ease-in-out infinite alternate;
  animation-delay:var(--delay);
}
@keyframes constellationTwinkle{to{opacity:calc(var(--o) * .34);transform:scale(.65)}}

@media(max-width:1180px){
  .hero-visual.constellation-ready{height:580px}
  .hero-visual.constellation-ready .hero-mark{width:285px;height:285px;margin:-142.5px 0 0 -142.5px}
  .core-halo{width:390px;height:390px}
}
@media(max-width:980px){
  .hero-visual.constellation-ready{height:510px;max-width:720px}
  .hero-visual.constellation-ready .orbital{inset:-2% 0 0}
  .hero-visual.constellation-ready::after{inset:3% -2% 0}
}
@media(max-width:650px){
  .hero-visual.constellation-ready{height:390px;overflow:hidden;margin-top:10px}
  .hero-visual.constellation-ready::before{inset:0 -25%;background-size:auto,23px 23px;opacity:.45}
  .hero-visual.constellation-ready::after{inset:0 -18%}
  .hero-visual.constellation-ready .orbital{inset:0 -10%}
  .hero-visual.constellation-ready .hero-mark{width:190px;height:190px;margin:-95px 0 0 -95px}
  .core-halo{width:285px;height:285px}
  .core-shield{width:175px;height:175px}
  .ring-a{width:94%;height:38%}
  .ring-b{width:72%;height:53%}
  .ring-c{display:none}
  .hero-visual.constellation-ready .project-chip{font-size:8.5px;padding:7px 9px 7px 8px}
  .hero-visual.constellation-ready .project-chip::before{width:4px;height:4px;margin-right:6px}
  .constellation-star:nth-of-type(3n){display:none}
}
@media(prefers-reduced-motion:reduce){
  /* Keep the user-requested constellation interaction alive, but remove decorative star twinkle. */
  .constellation-star{animation:none!important}
}
