/* AETHERsphere selected homepage hero animation: ASC Animation Test v1, production integration. */
.hero.hero-cinematic{position:relative;overflow:hidden;min-height:clamp(560px,76vh,820px);background:#030000;isolation:isolate}
.aether-v1-home{position:absolute;inset:0;overflow:hidden;background:radial-gradient(circle at 50% 55%,rgba(190,20,0,.14),transparent 30%),radial-gradient(circle at 50% 50%,rgba(255,174,0,.05),transparent 55%),#030000;perspective:1100px;isolation:isolate;z-index:0}
.aether-v1-vignette{position:absolute;inset:0;box-shadow:inset 0 0 180px 70px #000;z-index:50;pointer-events:none}
.aether-v1-grid{position:absolute;left:-20%;right:-20%;bottom:-48%;height:100%;transform:rotateX(68deg);transform-origin:center top;background-image:linear-gradient(rgba(255,60,0,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(255,170,0,.13) 1px,transparent 1px);background-size:48px 48px;filter:drop-shadow(0 0 8px rgba(255,65,0,.35));animation:aetherV1GridMove 2.2s linear infinite}
@keyframes aetherV1GridMove{to{background-position:0 48px,48px 0}}
.aether-v1-tunnel{position:absolute;left:50%;top:50%;width:120vmax;height:120vmax;transform:translate(-50%,-50%);border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(255,45,0,0) 0 6deg,rgba(255,62,0,.14) 7deg 8deg,rgba(255,185,0,.10) 9deg 10deg,transparent 11deg 18deg);animation:aetherV1Spin 8s linear infinite;filter:blur(.2px)}
@keyframes aetherV1Spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
.aether-v1-ring{position:absolute;left:50%;top:50%;border-radius:50%;border:2px solid rgba(255,134,0,.45);box-shadow:0 0 24px rgba(255,46,0,.5),inset 0 0 18px rgba(255,180,0,.25);transform:translate(-50%,-50%) rotateX(72deg);opacity:.9}
.aether-v1-r1{width:min(55vw,760px);height:min(55vw,760px);animation:aetherV1RingPulse 2s ease-in-out infinite}.aether-v1-r2{width:min(38vw,525px);height:min(38vw,525px);animation:aetherV1RingPulse 2s .4s ease-in-out infinite}.aether-v1-r3{width:min(23vw,320px);height:min(23vw,320px);animation:aetherV1RingPulse 2s .8s ease-in-out infinite}
@keyframes aetherV1RingPulse{50%{transform:translate(-50%,-50%) rotateX(72deg) scale(1.08);opacity:.35}}
.aether-v1-beam{position:absolute;left:50%;top:7%;width:8px;height:53%;transform:translateX(-50%);background:linear-gradient(#fff9c8,#ffbd00 28%,#ff2b00 72%,transparent);box-shadow:0 0 12px #fff,0 0 38px #ffb000,0 0 85px #ff2600;opacity:0;animation:aetherV1BeamSeq 15s linear infinite}
@keyframes aetherV1BeamSeq{0%,24%{opacity:0}30%,49%{opacity:1}54%,100%{opacity:0}}
.aether-v1-core{position:absolute;left:50%;top:55%;width:16px;height:16px;border-radius:50%;transform:translate(-50%,-50%);background:#fff4b5;box-shadow:0 0 10px #fff,0 0 30px #ffb000,0 0 80px #ff2500;animation:aetherV1CoreSeq 15s linear infinite}
@keyframes aetherV1CoreSeq{0%{opacity:0;transform:translate(-50%,-50%) scale(.1)}12%{opacity:1;transform:translate(-50%,-50%) scale(.35)}26%{transform:translate(-50%,-50%) scale(.8)}39%{transform:translate(-50%,-50%) scale(2.2)}50%{transform:translate(-50%,-50%) scale(.45)}100%{opacity:.9}}
.aether-v1-energy{position:absolute;left:50%;top:50%;width:18vmax;height:18vmax;border-radius:50%;transform:translate(-50%,-50%);background:conic-gradient(from 20deg,transparent 0 9%,#ff3000 10% 14%,transparent 15% 30%,#ffb000 31% 35%,transparent 36% 55%,#ff2700 56% 60%,transparent 61% 75%,#ffd24a 76% 80%,transparent 81%);filter:blur(2px) drop-shadow(0 0 20px #ff4200);opacity:0;animation:aetherV1EnergySeq 15s linear infinite}
@keyframes aetherV1EnergySeq{0%,8%{opacity:0;transform:translate(-50%,-50%) scale(.2) rotate(0)}15%,38%{opacity:1;transform:translate(-50%,-50%) scale(1.25) rotate(360deg)}48%{opacity:.35;transform:translate(-50%,-50%) scale(.18) rotate(620deg)}100%{opacity:0}}
.aether-v1-streak{position:absolute;left:50%;top:50%;height:2px;transform-origin:left center;background:linear-gradient(90deg,#fff6c9,#ffb000 24%,#ff2b00 60%,transparent);box-shadow:0 0 10px #ff3b00;opacity:0;animation:aetherV1StreakSeq 15s linear infinite}
@keyframes aetherV1StreakSeq{0%,39%{opacity:0;width:0}46%,61%{opacity:.8;width:46vw}69%,100%{opacity:0}}
.aether-v1-coin-wrap{position:absolute;left:50%;top:50%;width:min(30vw,310px);aspect-ratio:1;transform-style:preserve-3d;opacity:0;animation:aetherV1CoinSeq 15s cubic-bezier(.2,.8,.2,1) infinite;z-index:20}
@keyframes aetherV1CoinSeq{0%,46%{opacity:0;transform:translate(-50%,-50%) scale(.05) rotateY(0deg) rotateX(18deg)}53%{opacity:1;transform:translate(-50%,-50%) scale(.5) rotateY(180deg) rotateX(10deg)}64%{transform:translate(-50%,-50%) scale(1.15) rotateY(540deg) rotateX(-6deg)}78%{transform:translate(-50%,-50%) scale(.92) rotateY(760deg) rotateX(3deg)}100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotateY(1080deg) rotateX(0deg)}}
.aether-v1-coin{position:absolute;inset:0;border-radius:50%;padding:6%;box-sizing:border-box;background:radial-gradient(circle at 38% 30%,#4a1700,#160400 48%,#050000 71%);border:8px solid #d58a00;box-shadow:0 0 0 4px #7b1b00,0 0 30px rgba(255,174,0,.65),0 0 70px rgba(255,42,0,.55),inset 0 0 28px rgba(255,145,0,.4)}
.aether-v1-coin:before{content:"";position:absolute;inset:5%;border-radius:50%;border:2px solid rgba(255,205,80,.8);box-shadow:inset 0 0 20px rgba(255,30,0,.6)}
.aether-v1-coin img{position:absolute;inset:11%;width:78%;height:78%;object-fit:contain;border-radius:50%;filter:drop-shadow(0 0 12px rgba(255,165,0,.65))}
.aether-v1-label{position:absolute;left:50%;bottom:8%;transform:translateX(-50%);text-align:center;z-index:25;opacity:0;animation:aetherV1LabelSeq 15s linear infinite;white-space:nowrap}
.aether-v1-main{font-size:clamp(28px,5vw,72px);font-weight:900;letter-spacing:.08em;color:#f6bd31;text-shadow:0 0 16px #a80000,0 0 34px rgba(255,170,0,.45)}
.aether-v1-sub{font-size:clamp(12px,1.4vw,20px);letter-spacing:.34em;color:#c92b18;margin-top:6px}
@keyframes aetherV1LabelSeq{0%,57%{opacity:0;transform:translate(-50%,20px)}66%,96%{opacity:1;transform:translate(-50%,0)}100%{opacity:.8}}
.aether-v1-particle{position:absolute;width:3px;height:3px;border-radius:50%;background:#ffb000;box-shadow:0 0 8px #ff2a00;animation:aetherV1Fly linear infinite}
@keyframes aetherV1Fly{from{transform:translate3d(0,0,0) scale(.4);opacity:0}15%{opacity:1}to{transform:translate3d(var(--dx),var(--dy),0) scale(1.7);opacity:0}}
.hero-cinematic-shade{position:absolute;inset:0;z-index:30;pointer-events:none;background:linear-gradient(90deg,rgba(0,0,0,.80) 0%,rgba(0,0,0,.52) 34%,rgba(0,0,0,.12) 62%,rgba(0,0,0,.30) 100%)}
.hero-content-layer{position:relative;z-index:40}
@media(max-width:900px){.hero.hero-cinematic{min-height:690px}.hero-cinematic-shade{background:linear-gradient(180deg,rgba(0,0,0,.70) 0%,rgba(0,0,0,.35) 48%,rgba(0,0,0,.66) 100%)}.aether-v1-coin-wrap{width:54vw}.aether-v1-r1{width:105vw;height:105vw}.aether-v1-r2{width:76vw;height:76vw}.aether-v1-r3{width:45vw;height:45vw}.aether-v1-label{bottom:7%}.aether-v1-grid{height:75%;bottom:-35%}}
@media(prefers-reduced-motion:reduce){.aether-v1-home *{animation-play-state:paused!important}.aether-v1-coin-wrap{opacity:1;transform:translate(-50%,-50%) scale(1)}.aether-v1-label{opacity:1;transform:translateX(-50%)}}

/* v40 desktop hero alignment: keep the selected v1 animation, move its visual focus left
   and reserve the right side for the existing hero copy. Mobile layout remains unchanged. */
@media (min-width:901px){
  .aether-v1-home{
    background:
      radial-gradient(circle at 27% 55%,rgba(190,20,0,.14),transparent 30%),
      radial-gradient(circle at 27% 50%,rgba(255,174,0,.05),transparent 55%),
      #030000;
  }
  .aether-v1-tunnel,
  .aether-v1-ring,
  .aether-v1-beam,
  .aether-v1-core,
  .aether-v1-energy,
  .aether-v1-streak,
  .aether-v1-coin-wrap,
  .aether-v1-label{left:27%;}

  .hero-cinematic-shade{
    background:linear-gradient(90deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,.12) 43%,rgba(0,0,0,.64) 58%,rgba(0,0,0,.88) 100%);
  }

  .hero-content-layer .hero-copy{
    margin-left:auto;
    width:min(52%,680px);
    max-width:680px;
  }
}


/* v40.1 FORCE FIX — desktop split hero.
   Animation focus on LEFT, existing copy on RIGHT. */
@media (min-width:901px){
  .hero.hero-cinematic .aether-v1-tunnel,
  .hero.hero-cinematic .aether-v1-ring,
  .hero.hero-cinematic .aether-v1-beam,
  .hero.hero-cinematic .aether-v1-core,
  .hero.hero-cinematic .aether-v1-energy,
  .hero.hero-cinematic .aether-v1-streak,
  .hero.hero-cinematic .aether-v1-coin-wrap,
  .hero.hero-cinematic .aether-v1-label{left:26% !important;}

  .hero.hero-cinematic .aether-v1-home{
    background:
      radial-gradient(circle at 26% 55%,rgba(190,20,0,.14),transparent 30%),
      radial-gradient(circle at 26% 50%,rgba(255,174,0,.05),transparent 55%),
      #030000 !important;
  }

  .hero.hero-cinematic .hero-content-layer{
    display:flex !important;
    justify-content:flex-end !important;
    align-items:center !important;
  }

  .hero.hero-cinematic .hero-content-layer .hero-copy{
    margin-left:auto !important;
    margin-right:0 !important;
    width:50% !important;
    max-width:650px !important;
  }

  .hero.hero-cinematic .hero-cinematic-shade{
    background:linear-gradient(90deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.10) 44%,rgba(0,0,0,.58) 59%,rgba(0,0,0,.88) 100%) !important;
  }
}
