/* Section Slider */
.section-slider {
  overflow: hidden;
  max-height: 64rem;
  display: flex;
  align-items: flex-end;
}

.section-slider .slider-with-svg-overlay {
  position: relative;
  overflow: hidden;
}

.section-slider .swiper,
.section-slider .swiper-wrapper {
  height: 100%;
}

.section-slider .swiper-slide {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.section-slider .slider-slide-link,
.section-slider .swiper-slide > a {
  display: block;
  width: 100%;
  line-height: 0;
}

.section-slider .slider-img {
  width: 100%;
  height: auto;
  object-fit: cover;
  object-position: center;
  vertical-align: top;
  max-height: 90vh;
}

.section-slider .video-container {
  width: 100%;
  height: 100%;
  min-height: 280px;
  max-height: 90vh;
}

.section-slider .video-container .video-element {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.section-slider .hero-crop-svg {
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  display: block;
  width: 100%;
  min-width: 100%;
  height: auto;
  pointer-events: none;
  z-index: 2;
}

/* Wave Animation */
.wave-path-solid {
  transform-origin: bottom;
  animation: waveSolid 8s ease-in-out infinite alternate;
}

.wave-path-gradient {
  transform-origin: bottom;
  animation: waveGradient 6s ease-in-out infinite alternate 0.5s;
}

@keyframes waveSolid {
  0% {
    d: path(
      "M1432 185.5L1440 182V491.5H-21V105.5C37.1667 200 218.9 390.4 480.5 396C742.1 401.6 1223.83 258 1432 185.5Z"
    );
  }

  100% {
    d: path(
      "M 1432 185.5 L 1440 182 V 491.5 H -21 V 105.5 C 35 252 214 353 566 348 C 800 344 1223.83 258 1432 185.5 Z"
    );
  }
}

@keyframes waveGradient {
  0% {
    d: path(
      "M-2.58203 -0.274414C-1.04083 31.8999 2.30938 65.5406 9.55762 91.334C17.4507 119.422 34.874 160.683 71.8965 199.653C117.139 247.276 171.426 276.341 229.693 297.379C264.7 310.018 327.175 325.431 384.942 329.939C442.679 334.445 447.21 333.945 501.42 334.445C555.638 334.946 648.008 331.943 697.721 326.936C747.402 321.931 861.358 310.918 939.176 297.4C1016.96 283.889 1065.67 276.378 1110.35 266.364C1155.02 256.356 1167.07 255.352 1290.55 224.318C1406.11 195.276 1395.96 196.476 1432.01 185.415C1409.38 194.575 1403.93 197.433 1305.92 230.135C1185.15 270.427 1173.22 272.337 1129.43 285.701C1085.65 299.065 1037.67 310.238 961.118 329.604C884.568 348.971 771.795 368.579 722.627 377.332C673.459 386.085 581.602 396.073 527.514 399.679C473.425 403.284 468.958 404.126 411.063 404.005C353.168 403.884 289.749 393.252 253.927 383.312C194.28 366.759 138.028 341.918 89.3848 297.927C49.591 261.939 29.1324 222.19 19.1562 194.839C-4.2909 130.554 -6.24965 13.0553 -9.69922 0.266602L-2.58203 -0.274414ZM1451.92 177.565C1447.57 179.238 1443.83 180.701 1440.5 182.018V27.1436L1451.92 177.565Z"
    );
  }

  100% {
    d: path(
      "M -2.582 -0.2744 C -1.0408 31.8999 2.3094 65.5406 9.5576 91.334 C 17.4507 119.422 34.874 160.683 71.8965 199.653 C 117.139 247.276 165 283 221 313 C 265 337 323 345 377 351 C 437 358 449 358 499 357 C 588 355 627 355 697 346 C 761 336 876 313 943 299 C 1015 288 1065 278 1110.35 266.364 C 1155.02 256.356 1167.07 255.352 1290.55 224.318 C 1406.11 195.276 1395.96 196.476 1432.01 185.415 C 1409.38 194.575 1403.93 197.433 1304 237 C 1232 264 1203 276 1131 295 C 1051 322 1052 324 962 342 C 865 365 763 377 719 385 C 672 392 581.602 396.073 527.514 399.679 C 473.425 403.284 468.958 404.126 411.063 404.005 C 353.168 403.884 289.749 393.252 253.927 383.312 C 194.28 366.759 138.028 341.918 89.3848 297.927 C 49.591 261.939 29.1324 222.19 19.1562 194.839 C -4.2909 130.554 -6.2496 13.0553 -9.6992 0.2666 L -2.582 -0.2744 Z M 1451.92 177.565 C 1447.57 179.238 1443.83 180.701 1440.5 182.018 V 27.1436 L 1451.92 177.565 Z"
    );
  }
}

.section-slider .slider-with-svg-overlay::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 10%;
  right: 14%;
  width: clamp(90px, 15vw, 200px);
  height: clamp(70px, 12.5vw, 167px);
  background-image: url(../../img/hero-slider.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: right bottom;
  z-index: 3;
  pointer-events: none;

  animation: heroFloat 8s ease-in-out infinite;
  transform-origin: center center;
}

@keyframes heroFloat {
  0% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }

  50% {
    transform: translate3d(0, -10px, 0) rotate(6deg);
  }

  100% {
    transform: translate3d(0, 0, 0) rotate(0deg);
  }
}

/* Mobile */
@media screen and (max-width: 767px) {
  .section-slider .slider-with-svg-overlay {
    --slider-mobile-h: min(55vw, 380px);
  }

  .section-slider .swiper-hero,
  .section-slider .swiper-wrapper,
  .section-slider .swiper-slide {
    min-height: var(--slider-mobile-h, 300px);
  }

  .section-slider .slider-img {
    min-height: var(--slider-mobile-h, 300px);
    object-fit: cover;
  }

  .section-slider .video-container {
    min-height: var(--slider-mobile-h, 280px);
  }

  .section-slider .slider-with-svg-overlay::after {
    bottom: 0;
  }
}

@media screen and (max-width: 374px) {
  .section-slider .slider-with-svg-overlay {
    --slider-mobile-h: 250px;
  }
}