/* Generated from the landing GEN wave; reuse its shared SVG assets. */

/* V4.7 — stronger, continuously moving GEN-inspired contour field */
.blog-hero{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(65% 62% at 88% 30%,rgba(255,88,12,.070) 0%,rgba(255,88,12,.025) 50%,rgba(255,88,12,0) 78%),
    linear-gradient(180deg,#fff 0%,#fff 70%,rgba(241,240,235,.34) 100%);
}
.blog-hero>.wrap{
  position:relative;
  z-index:4;
}

/* Real DOM-based animation layer, instead of pseudo-elements. */
.gen-wave-field{
  position:absolute;
  inset:0;
  z-index:1;
  overflow:hidden;
  pointer-events:none;
}

.gen-wave-layer{
  position:absolute;
  inset:-16% -12%;
  background-repeat:repeat-x;
  will-change:transform,background-position;
}

/* Main contour family */
.gen-wave-layer-a{
  opacity:.98;
  background-image:url("../assets/images/decorative/gen-wave-a.svg");
  background-size:1800px 900px;
  background-position:0 42%;
  animation:genWaveSlideA 16s linear infinite;
}

/* Counter-moving family to create the soft interference effect */
.gen-wave-layer-b{
  opacity:.72;
  background-image:url("../assets/images/decorative/gen-wave-b.svg");
  background-size:1900px 950px;
  background-position:0 52%;
  animation:genWaveSlideB 23s linear infinite reverse;
}

/* Soft vertical breathing layer, mostly around the right half */
.gen-wave-layer-c{
  opacity:.46;
  left:24%;
  background-image:url("../assets/images/decorative/gen-wave-c.svg");
  background-size:1700px 880px;
  background-position:0 48%;
  animation:genWaveBreathe 10s ease-in-out infinite alternate;
}

/* Keep copy crisp without drawing a visible panel. */
.gen-wave-fade{
  position:absolute;
  inset:0;
  z-index:2;
  background:
    radial-gradient(ellipse at 30% 42%,rgba(255,255,255,.94) 0%,rgba(255,255,255,.78) 37%,rgba(255,255,255,.25) 62%,rgba(255,255,255,0) 78%),
    linear-gradient(90deg,rgba(255,255,255,.52) 0%,rgba(255,255,255,.12) 45%,rgba(255,255,255,0) 78%);
}

@keyframes genWaveSlideA{
  from{background-position:0 42%;transform:translate3d(0,0,0)}
  to{background-position:1800px 42%;transform:translate3d(-1.5%,1.2%,0)}
}
@keyframes genWaveSlideB{
  from{background-position:0 52%;transform:translate3d(0,-1%,0)}
  to{background-position:1900px 52%;transform:translate3d(1.8%,1.2%,0)}
}
@keyframes genWaveBreathe{
  from{background-position:0 48%;transform:translate3d(-1.2%,-1.4%,0) scale(1.01)}
  to{background-position:700px 51%;transform:translate3d(1.2%,1.7%,0) scale(1.035)}
}

@media(max-width:860px){
  .gen-wave-layer-a{opacity:.76;animation-duration:18s}
  .gen-wave-layer-b{opacity:.50;animation-duration:26s}
  .gen-wave-layer-c{opacity:.28;animation-duration:12s}
  .gen-wave-fade{
    background:
      radial-gradient(ellipse at 33% 35%,rgba(255,255,255,.94) 0%,rgba(255,255,255,.79) 42%,rgba(255,255,255,.28) 68%,rgba(255,255,255,0) 86%);
  }
}

@media(prefers-reduced-motion:reduce){
  .gen-wave-layer{animation:none!important}
}