/* ── Diagonal silk band with curvy wavy edges ── */
.bg-aurora{
 position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;
}

.aurora-blob{display:none}

/* Main silk — wide, with wavy clip-path edges */
.aurora-silk{
 position:absolute;
 width:20%;
 height:250%;
 top:-55%;
 left:73%;
 
 transform-origin:center center;
 animation:silkFlow 16s ease-in-out infinite, fadeA 9s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(120,80,255,.4) 0%,
  rgba(200,60,200,.48) 15%,
  rgba(255,100,140,.52) 30%,
  rgba(255,160,60,.55) 45%,
  rgba(255,100,120,.52) 60%,
  rgba(200,50,200,.48) 75%,
  rgba(100,70,240,.4) 90%,
  rgba(80,100,255,.35) 100%
 );
 clip-path:url(#silk1);
}

/* Second layer — offset, different wave */
.aurora-silk-2{
 position:absolute;
 width:16%;
 height:220%;
 top:-49%;
 left:72%;
 
 transform-origin:center center;
 filter:blur(8px);
 animation:silkFlow2 20s ease-in-out infinite, fadeB 9s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(80,60,240,.35) 0%,
  rgba(250,100,130,.45) 25%,
  rgba(255,170,50,.42) 50%,
  rgba(240,70,160,.4) 75%,
  rgba(120,60,230,.35) 100%
 );
 clip-path:url(#silk2);
}

/* Inner core — sharp, bright */
.aurora-silk-3{
 position:absolute;
 width:14%;
 height:190%;
 top:-46%;
 left:73%;
 transform-origin:center center;
 filter:blur(2px);
 animation:silkFlow3 14s ease-in-out infinite, fadeC 9s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(255,130,80,.3) 0%,
  rgba(255,80,140,.58) 30%,
  rgba(255,170,50,.65) 50%,
  rgba(255,90,120,.62) 70%,
  rgba(200,60,200,.68) 100%
 );
 clip-path:url(#silk3);
}

/* Fourth layer — soft wide glow */
.aurora-silk-4{
 position:absolute;
 width:22%;
 height:230%;
 top:-52%;
 left:68%;
 transform-origin:center center;
 filter:blur(12px);
 animation:silkFlow4 22s ease-in-out infinite, fadeD 11s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(160,60,255,.25) 0%,
  rgba(255,80,180,.32) 25%,
  rgba(255,140,80,.3) 50%,
  rgba(220,60,180,.28) 75%,
  rgba(100,80,240,.22) 100%
 );
 clip-path:url(#silk4);
}

/* Fifth layer — warm orange straight band, low opacity */
.aurora-silk-5{
 position:absolute;
 width:28%;
 height:260%;
 top:-58%;
 left:65%;
 transform-origin:center center;
 filter:blur(6px);
 opacity:.05;
 animation:silkFlow5 18s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(255,140,50,1) 0%,
  rgba(255,100,60,1) 25%,
  rgba(255,80,100,1) 50%,
  rgba(240,60,140,1) 75%,
  rgba(220,50,160,1) 100%
 );
 clip-path:url(#silk5);
}

/* Sixth layer — pink-magenta straight band, low opacity */
.aurora-silk-6{
 position:absolute;
 width:24%;
 height:240%;
 top:-54%;
 left:70%;
 transform-origin:center center;
 filter:blur(4px);
 opacity:.05;
 animation:silkFlow6 24s ease-in-out infinite;
 background:linear-gradient(90deg,
  rgba(255,80,160,1) 0%,
  rgba(255,120,80,1) 25%,
  rgba(255,160,50,1) 50%,
  rgba(255,90,130,1) 75%,
  rgba(230,50,180,1) 100%
 );
 clip-path:url(#silk6);
}

@keyframes silkFlow{
 0%,100%{transform:rotate(-37deg) translateX(0) translateY(0)}
 25%{transform:rotate(-35deg) translateX(1vw) translateY(1vh)}
 50%{transform:rotate(-38deg) translateX(-1vw) translateY(-1vh)}
 75%{transform:rotate(-36deg) translateX(-1vw) translateY(1vh)}
}
@keyframes silkFlow2{
 0%,100%{transform:rotate(-34deg) translateX(0) translateY(0)}
 33%{transform:rotate(-32deg) translateX(-2vw) translateY(-1vh)}
 66%{transform:rotate(-36deg) translateX(1vw) translateY(1vh)}
}
@keyframes silkFlow3{
 0%,100%{transform:rotate(-39deg) translateX(0) translateY(0)}
 25%{transform:rotate(-37deg) translateX(2vw) translateY(-1vh)}
 50%{transform:rotate(-40deg) translateX(-1vw) translateY(2vh)}
 75%{transform:rotate(-38deg) translateX(-1vw) translateY(-1vh)}
}

@keyframes fadeA{
 0%,100%{opacity:.75}
 50%{opacity:.45}
}
@keyframes fadeB{
 0%,100%{opacity:.4}
 50%{opacity:.7}
}
@keyframes silkFlow4{
 0%,100%{transform:rotate(-32deg) translateX(0) translateY(0)}
 25%{transform:rotate(-30deg) translateX(-1vw) translateY(2vh)}
 50%{transform:rotate(-34deg) translateX(2vw) translateY(-1vh)}
 75%{transform:rotate(-31deg) translateX(1vw) translateY(-1vh)}
}

@keyframes fadeC{
 0%,100%{opacity:.55}
 33%{opacity:.7}
 66%{opacity:.35}
}
@keyframes fadeD{
 0%,100%{opacity:.35}
 50%{opacity:.6}
}
@keyframes silkFlow5{
 0%,100%{transform:rotate(-35deg) translateX(0) translateY(0)}
 50%{transform:rotate(-33deg) translateX(1vw) translateY(1vh)}
}
@keyframes silkFlow6{
 0%,100%{transform:rotate(-40deg) translateX(0) translateY(0)}
 50%{transform:rotate(-38deg) translateX(-1vw) translateY(-1vh)}
}

.aurora-ribbons{display:none}
