@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Rajdhani:wght@300;400;500;600;700&family=Orbitron:wght@400;600;700;900&display=swap');

.svpa-wave{
  --svpa-wave-bg:#1a1a1a;
  --svpa-wave-bg-img-opacity:0.12;
  --svpa-wave-red:#e31010;
  --svpa-wave-white:#ffffff;
  --svpa-wave-label-color:#e31010;
  --svpa-wave-h2-color:#ffffff;
  --svpa-wave-em-color:#e31010;
  --svpa-wave-desc-color:rgba(255,255,255,0.74);
  --svpa-wave-point-color:rgba(255,255,255,0.76);
  --svpa-wave-point-border:rgba(255,255,255,0.06);
  --svpa-wave-dot-color:#e31010;
  --svpa-wave-wrap-max:1340px;
  --svpa-wave-bar-color:#e31010;

  --svpa-wave-btn-red-bg:#e31010;
  --svpa-wave-btn-red-color:#ffffff;
  --svpa-wave-btn-red-bg-h:#b50d0d;

  --svpa-wave-ease:cubic-bezier(.16,1,.3,1);

  padding:120px 0;
  background:var(--svpa-wave-bg);
  position:relative;overflow:hidden;
  font-family:'Rajdhani',sans-serif;
  color:var(--svpa-wave-white);
}
.svpa-wave *,
.svpa-wave *::before,
.svpa-wave *::after{box-sizing:border-box;}
.svpa-wave img{display:block;max-width:100%;}

.svpa-wave-bg-img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  opacity:var(--svpa-wave-bg-img-opacity);
  filter:saturate(.3);
}

.svpa-wave-inner{ position:relative; z-index:1; }
.svpa-wave-wrap{ max-width:var(--svpa-wave-wrap-max); margin:0 auto; padding:0 28px; }
.svpa-wave-layout{ display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }

/* Left */
.svpa-wave-label{
  font-family:'Orbitron',monospace;
  font-size:.62rem;letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--svpa-wave-label-color);
  display:inline-flex;align-items:center;gap:8px;
  margin-bottom:12px;
}
.svpa-wave-label::before{ content:''; width:22px; height:1px; background:var(--svpa-wave-label-color); }
.svpa-wave-h2{
  font-family:'Bebas Neue',sans-serif;
  font-size:clamp(2.4rem,5vw,5rem);
  letter-spacing:3px;
  color:var(--svpa-wave-h2-color);
  line-height:.95;
  margin:0 0 22px;
}
.svpa-wave-h2 em{ color:var(--svpa-wave-em-color); font-style:normal; display:block; }
.svpa-wave-desc{
  font-size:.92rem;font-weight:400;
  color:var(--svpa-wave-desc-color);
  line-height:1.8;margin:0 0 32px;max-width:380px;
}
.svpa-wave-points{ margin-bottom:36px; }
.svpa-wave-point{
  display:flex;align-items:center;gap:14px;
  padding:10px 0;
  border-bottom:1px solid var(--svpa-wave-point-border);
  font-size:.88rem;font-weight:500;
  color:var(--svpa-wave-point-color);
}
.svpa-wave-dot{
  width:6px;height:6px;
  background:var(--svpa-wave-dot-color);
  flex-shrink:0;border-radius:50%;
}

/* Right */
.svpa-wave-right{
  display:flex;flex-direction:column;align-items:center;gap:20px;
}
.svpa-wave-img-wrap{ position:relative; width:100%; overflow:hidden; }
.svpa-wave-img-wrap img{ width:100%; height:300px; object-fit:cover; opacity:.7; transition:opacity .4s; }
.svpa-wave-img-wrap:hover img{ opacity:.5; }

.svpa-wave-waveform{ width:100%; overflow:hidden; height:60px; }
.svpa-wave-waveform svg{ width:100%; height:60px; }
.svpa-wave-wv1, .svpa-wave-wv2, .svpa-wave-wv3{ fill:none; stroke-linecap:round; }
.svpa-wave-wv1{ stroke:rgba(227,16,16,.8); stroke-width:2.5; animation:svpa-wavePulse1 2.4s ease-in-out infinite; }
.svpa-wave-wv2{ stroke:rgba(255,80,80,.4); stroke-width:1.5; animation:svpa-wavePulse2 1.8s ease-in-out infinite; }
.svpa-wave-wv3{ stroke:rgba(200,20,20,.25); stroke-width:1;   animation:svpa-wavePulse3 3s ease-in-out infinite; }

@keyframes svpa-wavePulse1{
  0%,100%{ d:path("M0,30 C80,10 160,50 240,30 C320,10 400,50 480,30 C560,10 640,50 720,30 C800,10 880,50 960,30 C1040,10 1120,50 1200,30 C1280,10 1360,50 1440,30"); }
  50%   { d:path("M0,30 C80,50 160,10 240,30 C320,50 400,10 480,30 C560,50 640,10 720,30 C800,50 880,10 960,30 C1040,50 1120,10 1200,30 C1280,50 1360,10 1440,30"); }
}
@keyframes svpa-wavePulse2{
  0%,100%{ d:path("M0,30 C60,8 120,52 180,30 C240,8 300,52 360,30 C420,8 480,52 540,30 C600,8 660,52 720,30 C780,8 840,52 900,30 C960,8 1020,52 1080,30 C1140,8 1200,52 1260,30 C1320,8 1380,52 1440,30"); }
  50%   { d:path("M0,30 C60,52 120,8 180,30 C240,52 300,8 360,30 C420,52 480,8 540,30 C600,52 660,8 720,30 C780,52 840,8 900,30 C960,52 1020,8 1080,30 C1140,52 1200,8 1260,30 C1320,52 1380,8 1440,30"); }
}
@keyframes svpa-wavePulse3{
  0%,100%{ d:path("M0,30 C120,14 240,46 360,30 C480,14 600,46 720,30 C840,14 960,46 1080,30 C1200,14 1320,46 1440,30"); }
  50%   { d:path("M0,30 C120,46 240,14 360,30 C480,46 600,14 720,30 C840,46 960,14 1080,30 C1200,46 1320,14 1440,30"); }
}

/* Equalizer bars */
.svpa-wave-bars{ display:flex; align-items:flex-end; gap:3px; height:50px; padding:0 4px; width:100%; }
.svpa-wave-bar{
  flex:1;
  background:var(--svpa-wave-bar-color);
  border-radius:1px 1px 0 0;
  transform-origin:bottom;
  opacity:.6;
  height:60%;
}
@keyframes svpa-barBounce{ from{ transform:scaleY(.2); } to{ transform:scaleY(1); } }
.svpa-wave-bar:nth-child(1) { animation:svpa-barBounce .5s ease-in-out infinite alternate; height:20%; }
.svpa-wave-bar:nth-child(2) { animation:svpa-barBounce .7s ease-in-out infinite alternate; height:60%; }
.svpa-wave-bar:nth-child(3) { animation:svpa-barBounce .4s ease-in-out infinite alternate; height:90%; }
.svpa-wave-bar:nth-child(4) { animation:svpa-barBounce .9s ease-in-out infinite alternate; height:45%; }
.svpa-wave-bar:nth-child(5) { animation:svpa-barBounce .3s ease-in-out infinite alternate; height:100%; }
.svpa-wave-bar:nth-child(6) { animation:svpa-barBounce .6s ease-in-out infinite alternate; height:75%; }
.svpa-wave-bar:nth-child(7) { animation:svpa-barBounce .55s ease-in-out infinite alternate; height:50%; }
.svpa-wave-bar:nth-child(8) { animation:svpa-barBounce .8s ease-in-out infinite alternate; height:85%; }
.svpa-wave-bar:nth-child(9) { animation:svpa-barBounce .45s ease-in-out infinite alternate; height:30%; }
.svpa-wave-bar:nth-child(10){ animation:svpa-barBounce .65s ease-in-out infinite alternate; height:70%; }
.svpa-wave-bar:nth-child(11){ animation:svpa-barBounce .5s ease-in-out infinite alternate;  height:55%; }
.svpa-wave-bar:nth-child(12){ animation:svpa-barBounce .75s ease-in-out infinite alternate; height:95%; }
.svpa-wave-bar:nth-child(13){ animation:svpa-barBounce .35s ease-in-out infinite alternate; height:40%; }
.svpa-wave-bar:nth-child(14){ animation:svpa-barBounce .85s ease-in-out infinite alternate; height:65%; }
.svpa-wave-bar:nth-child(15){ animation:svpa-barBounce .55s ease-in-out infinite alternate; height:80%; }
.svpa-wave-bar:nth-child(16){ animation:svpa-barBounce .6s ease-in-out infinite alternate;  height:35%; }
.svpa-wave-bar:nth-child(17){ animation:svpa-barBounce .4s ease-in-out infinite alternate;  height:90%; }
.svpa-wave-bar:nth-child(18){ animation:svpa-barBounce .7s ease-in-out infinite alternate;  height:50%; }
.svpa-wave-bar:nth-child(19){ animation:svpa-barBounce .5s ease-in-out infinite alternate;  height:60%; }
.svpa-wave-bar:nth-child(20){ animation:svpa-barBounce .55s ease-in-out infinite alternate; height:75%; }

/* Button */
.svpa-wave-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:'Rajdhani',sans-serif;
  font-size:.82rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  padding:14px 28px;
  border:1.5px solid transparent;border-radius:0;
  text-decoration:none;cursor:pointer;
  background:var(--svpa-wave-btn-red-bg);
  color:var(--svpa-wave-btn-red-color);
  position:relative;overflow:hidden;
  transition:background .22s ease,color .22s ease,border-color .22s ease,transform .22s ease,box-shadow .22s ease;
}
.svpa-wave-btn::after{
  content:'';position:absolute;top:0;left:-120%;
  width:55%;height:100%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);
  transition:left .55s var(--svpa-wave-ease);
  pointer-events:none;
}
.svpa-wave-btn:hover::after{ left:140%; }
.svpa-wave-btn:hover{ background:var(--svpa-wave-btn-red-bg-h); color:var(--svpa-wave-btn-red-color-h, var(--svpa-wave-btn-red-color)); transform:translateY(-2px); box-shadow:0 10px 30px rgba(227,16,16,.28); }

/* Reveal */
.svpa-wave-sr   { opacity:0; transform:translateY(36px); transition:opacity .7s var(--svpa-wave-ease),transform .7s var(--svpa-wave-ease); }
.svpa-wave-sr-r { opacity:0; transform:translateX(40px); transition:opacity .7s var(--svpa-wave-ease),transform .7s var(--svpa-wave-ease); }
.svpa-wave.svpa-wave-vis .svpa-wave-sr,
.svpa-wave.svpa-wave-vis .svpa-wave-sr-r{ opacity:1; transform:none; }
.svpa-wave-d1{transition-delay:.08s;} .svpa-wave-d2{transition-delay:.16s;}
.svpa-wave-d3{transition-delay:.24s;} .svpa-wave-d4{transition-delay:.32s;}

@media (max-width:1024px){
  .svpa-wave-layout{ grid-template-columns:1fr; gap:48px; }
  .svpa-wave{ padding:80px 0; }
}
@media (prefers-reduced-motion:reduce){
  .svpa-wave *{ transition:none !important; animation:none !important; }
  .svpa-wave-sr,.svpa-wave-sr-r{ opacity:1; transform:none; }
}