"use client";
import { gsap } from "gsap";
import { ScrollTrigger } from "gsap/ScrollTrigger";
import { useEffect } from "react";

const Momentus = () => {
  useEffect(() => {
    gsap.registerPlugin(ScrollTrigger);

    const timeline = gsap.timeline({
      ease: "slow",
      scrollTrigger: {
        trigger: ".services-big-word-momentus-wrapper",
        start: "-=500px",
        end: "-=300px",
        scrub: 0.7,
      },
      defaults: { ease: "none" },
    });

    for (let i = 0; i <= 7; i++) {
      timeline.fromTo(
        `.letter-${i}`,
        { y: 200, opacity: 0 },
        { duration: i + 10, y: 0, opacity: 1 }
      );
    }
  }, []);
  return (
    <div className="services-big-word-momentus-wrapper">
      <svg
        className="services-big-word-momentus"
        viewBox="0 0 1440 229"
        fill="none"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          className="letter-2"
          d="M702.826 133.932C702.826 121.369 704.958 109.042 708.748 97.1897C711.591 88.6559 715.618 80.5963 720.355 73.2477C717.75 68.7438 714.907 64.4769 711.354 60.6841C699.747 48.5946 682.691 42.4314 660.424 42.4314C653.792 42.4314 646.922 43.6166 639.579 45.7501C632.235 47.8835 625.129 50.9651 618.733 54.2838C612.337 57.6025 607.363 61.3953 603.81 65.4251L600.967 68.7438L598.361 65.1881C596.94 63.2917 594.334 60.4471 590.544 56.6543C586.991 53.0986 581.78 49.7799 575.147 46.6983C568.514 43.6166 559.75 42.1943 548.853 42.1943C540.089 42.1943 531.087 44.0907 522.086 47.6465C513.321 51.2022 505.504 57.3655 498.871 65.6622L493.423 72.2995L490.581 46.2242L438.704 60.6841C438.704 60.6841 450.548 73.0107 456.233 83.4408C464.524 98.612 468.788 115.679 468.788 134.406C468.788 153.133 464.524 170.201 456.233 185.372C450.548 195.802 442.967 204.81 434.203 212.395V222.114H492.476V128.48C492.476 117.813 495.792 109.042 502.188 102.642C508.584 96.2415 516.638 93.1599 525.876 93.1599C536.062 93.1599 543.642 96.4785 547.906 103.353C551.933 109.516 554.065 118.05 554.065 128.48V222.114H608.547V128.48C608.547 117.813 611.627 109.042 617.786 102.642C623.945 96.2415 631.999 93.1599 641.711 93.1599C651.66 93.1599 659.003 96.4785 663.504 103.353C667.768 109.516 669.9 118.05 669.9 128.717V222.352H728.172V205.995C711.591 188.216 702.826 164.037 702.826 133.932Z"
          fill="white"
        />
        <path
          className="letter-1"
          d="M450.311 86.9967C446.047 79.1741 440.599 72.2997 434.44 66.1364C433.256 64.9512 432.071 64.003 430.887 62.8178C429.702 61.8696 428.518 60.6843 427.333 59.7361C424.254 57.3656 420.938 54.9951 417.621 53.0988C403.645 44.802 387.064 40.5352 368.587 40.5352C350.11 40.5352 333.765 44.802 319.553 53.0988C309.84 58.7879 301.787 65.8994 294.917 74.4332C299.655 84.8633 302.023 96.9528 302.023 110.702V201.965C307.235 207.181 313.157 211.684 319.553 215.477C333.765 223.774 350.11 228.041 368.587 228.041C387.301 228.041 403.645 223.774 417.621 215.477C421.175 213.344 424.254 211.21 427.333 208.84C428.518 207.892 429.702 206.944 430.887 205.758C432.071 204.81 433.256 203.625 434.44 202.44C440.599 196.276 446.047 189.402 450.311 181.579C458.128 167.356 462.155 151.474 462.155 134.169C461.918 117.102 458.128 101.22 450.311 86.9967ZM397.013 165.223C389.906 173.757 380.194 178.024 368.35 178.024C356.506 178.024 346.794 173.757 339.687 165.223C332.818 156.926 329.265 146.733 329.265 134.407C329.265 122.317 332.818 111.887 339.687 103.59C346.794 95.0564 356.506 90.7895 368.35 90.7895C380.194 90.7895 389.906 95.0564 397.013 103.59C403.882 111.887 407.435 122.08 407.435 134.407C407.435 146.733 403.882 156.926 397.013 165.223Z"
          fill="white"
        />
        <path
          className="letter-0"
          d="M289.942 81.3074C289.469 79.8851 288.995 78.6999 288.284 77.2776C287.81 76.0923 287.1 74.9071 286.626 73.4848C284.02 68.7438 280.941 64.2399 277.151 60.4471C265.544 48.3576 248.488 42.1943 226.221 42.1943C219.589 42.1943 212.719 43.3796 205.376 45.513C198.033 47.6464 190.926 50.7281 184.53 54.0468C178.135 57.3655 173.16 61.1582 169.607 65.1881L166.764 68.7438L164.159 65.1881C162.737 63.2917 160.132 60.4471 156.341 56.6543C152.788 53.0986 147.577 49.7799 140.944 46.6983C134.312 43.6166 125.547 42.1943 114.65 42.1943C105.886 42.1943 96.8843 44.0907 87.8829 47.6465C79.1183 51.2022 71.3012 57.3655 64.6685 65.6622L59.2203 72.2995L56.3777 46.6983L0 62.3435V221.64H58.2727V128.006C58.2727 117.339 61.5891 108.568 67.9849 102.168C74.3807 95.7674 82.4346 92.6857 91.673 92.6857C101.859 92.6857 109.439 96.0044 113.703 102.879C117.73 109.042 119.862 117.576 119.862 128.006V221.64H174.344V128.006C174.344 117.339 177.424 108.568 183.583 102.168C189.742 95.7674 197.796 92.6857 207.508 92.6857C217.457 92.6857 224.8 96.0044 229.301 102.879C233.565 109.042 235.697 117.576 235.697 128.243V221.877H294.68V110.701C294.68 99.7972 293.022 90.0782 289.942 81.3074Z"
          fill="white"
        />
        <path
          className="letter-3"
          d="M861.3 62.5814C856.562 57.8404 851.114 53.5735 845.429 50.2548C832.4 42.9063 817.714 39.3506 801.606 39.3506C786.208 39.3506 772.469 41.9581 761.099 47.4103C749.729 52.6253 740.017 59.9738 732.436 68.9817C731.015 70.641 729.831 72.3004 728.646 73.9597C727.936 75.145 726.988 76.0932 726.277 77.2784C725.567 78.4637 724.619 79.6489 723.909 81.0712C720.355 86.7604 717.513 92.9237 715.381 99.561C711.591 110.702 709.696 122.318 709.696 134.17C709.696 159.297 716.092 179.921 728.646 195.329C729.831 196.751 731.015 198.173 732.199 199.359C733.147 200.544 734.331 201.492 735.279 202.677C735.279 202.677 735.516 202.914 735.753 202.914C752.808 218.797 777.918 227.093 809.896 227.093C827.663 227.093 843.297 224.723 855.851 220.219C857.746 219.508 859.405 219.034 861.063 218.323V174.943C856.562 177.076 851.351 178.972 844.955 181.106C835.48 183.95 824.82 185.61 813.213 185.61C801.369 185.61 791.893 183.95 784.787 180.632C777.681 177.313 772.469 172.809 769.39 167.831C766.31 162.853 764.652 157.875 764.415 153.134L764.178 149.341H861.063V62.5814H861.3ZM836.901 117.103H765.126V113.547C765.126 108.806 766.547 104.065 768.916 99.0869C771.522 94.1089 775.549 89.842 780.76 86.2863C786.208 82.7306 792.841 80.8342 800.658 80.8342C808.712 80.8342 815.582 82.7306 821.03 86.2863C826.241 89.842 830.268 94.1089 832.874 99.0869C835.48 104.065 836.664 108.806 836.664 113.547V117.103H836.901Z"
          fill="white"
        />
        <path
          className="letter-5"
          d="M1116.42 183.95C1102.44 182.765 1095.1 173.757 1095.1 158.112V69.6924L1150.77 39.5872H1095.1V0L1036.83 14.9341V57.1288C1039.43 60.2104 1042.04 63.7662 1044.17 67.796C1050.33 78.9373 1053.41 93.3973 1053.41 110.939V207.655C1056.96 211.922 1061.23 215.715 1066.2 218.796C1076.86 225.671 1091.78 228.989 1110.5 228.989C1120.68 228.989 1130.63 227.33 1140.35 223.774C1141.06 223.537 1141.77 223.063 1142.71 222.826C1139.63 220.93 1137.03 218.796 1134.19 216.426C1125.19 208.603 1119.5 197.936 1116.42 183.95Z"
          fill="white"
        />
        <path
          className="letter-7"
          d="M1343.59 146.259C1358.28 150.763 1368.23 154.082 1373.67 156.452C1382.2 160.008 1383.86 165.697 1383.86 169.727C1383.86 178.972 1378.65 182.528 1374.15 183.95C1368.94 185.609 1362.78 186.558 1355.91 186.558C1350.7 186.558 1344.77 185.846 1337.9 184.187C1331.03 182.528 1324.4 180.394 1318.24 177.55C1313.27 175.416 1308.77 172.809 1304.98 170.201L1304.74 170.438L1281.05 205.759C1286.97 210.5 1294.32 214.529 1302.61 217.848C1306.64 219.507 1310.66 220.693 1314.69 221.878C1339.09 228.515 1364.43 230.175 1388.83 225.197C1398.07 223.3 1406.84 220.219 1414.65 215.952C1422.23 211.685 1428.63 205.996 1433.13 198.884C1437.63 191.773 1440 183.002 1440 172.809C1440 160.956 1437.16 150.526 1431.24 141.755C1425.55 133.222 1413.71 125.873 1396.18 119.947C1388.36 117.102 1380.78 114.969 1373.91 113.309C1366.57 111.65 1360.88 109.517 1356.38 107.146C1349.75 103.59 1348.33 98.3754 1348.33 94.5826C1348.33 87.9452 1352.35 80.1226 1372.02 80.1226C1380.78 80.1226 1389.07 81.7819 1397.12 85.1006C1403.76 87.7082 1410.15 90.7898 1416.31 94.3455L1435.03 59.7364C1425.79 53.8102 1415.6 49.3062 1404.94 45.9875C1393.1 42.4318 1379.83 40.7725 1365.38 40.7725C1350.46 40.7725 1337.19 43.38 1326.06 48.121C1317.53 51.9138 1310.19 56.6548 1304.5 62.3439V126.584C1304.74 126.584 1304.74 126.821 1304.98 126.821C1315.16 135.118 1327.96 141.518 1343.59 146.259Z"
          fill="white"
        />
        <path
          className="letter-6"
          d="M1239.36 62.5798V141.043C1239.36 149.34 1237.23 157.399 1232.97 164.511C1228.23 172.333 1219.94 176.363 1208.33 176.363C1197.67 176.363 1189.85 173.045 1185.35 166.407C1181.33 160.244 1179.19 152.421 1179.19 142.939V47.4087L1120.92 78.9362V158.585C1120.92 165.222 1121.39 171.385 1122.34 177.074C1122.58 178.26 1122.82 179.445 1123.05 180.63C1123.29 181.815 1123.53 183.001 1123.76 184.186C1126.61 195.801 1131.58 205.046 1138.69 211.447C1142.24 214.765 1146.27 217.373 1150.53 219.743C1151.72 220.454 1153.14 221.166 1154.56 221.64C1155.98 222.351 1157.4 222.825 1158.82 223.299C1166.4 225.906 1174.46 227.329 1183.46 227.329C1187.48 227.329 1192.7 226.618 1198.85 225.195C1205.01 223.773 1211.17 221.403 1217.57 218.084C1223.73 214.765 1228.94 210.498 1233.2 204.809L1238.41 198.172L1241.49 222.114H1294.32C1294.08 222.114 1294.08 221.877 1293.84 221.877C1292.19 221.166 1290.53 220.217 1288.87 219.506C1288.63 219.269 1288.4 219.269 1288.16 219.032C1286.74 218.321 1285.32 217.373 1283.9 216.662C1283.66 216.425 1283.42 216.425 1283.18 216.187C1281.76 215.239 1280.34 214.291 1278.92 213.343C1278.68 213.106 1278.45 212.869 1277.97 212.632C1276.55 211.684 1275.37 210.498 1273.95 209.55L1271.58 207.417L1297.63 168.541V46.9346L1239.36 62.5798Z"
          fill="white"
        />
        <path
          className="letter-4"
          d="M1037.78 71.1141C1037.54 70.4029 1037.07 69.9288 1036.59 69.2177C1035.41 67.3213 1034.22 65.6619 1033.04 63.7655C1031.85 62.3432 1030.67 60.9209 1029.49 59.4987C1025.46 55.2318 1020.72 51.676 1015.51 49.0685C1006.03 44.3275 995.137 41.957 983.056 41.957C979.029 41.957 973.818 42.6682 967.659 44.0905C961.5 45.5128 955.341 47.8833 949.182 51.2019C943.26 54.5206 937.812 59.0246 933.311 64.4767L928.1 70.877L924.784 46.9351L868.406 62.3433V221.877H926.679V128.243C926.679 119.946 929.048 111.886 933.548 104.538C938.523 96.7153 947.524 92.9225 960.316 92.9225C969.791 92.9225 976.897 96.2412 981.161 102.642C985.188 108.568 987.32 116.627 987.32 126.346V221.877H1045.59V110.701C1046.07 94.5819 1043.22 81.0701 1037.78 71.1141Z"
          fill="white"
        />
      </svg>
    </div>
  );
};

export default Momentus;