.scroll-indicator {
      margin-bottom: 70px;
      width: 40px;
      height: 70px;
      border: 2px solid #fff;
      border-radius: 25px;
      position: absolute;
      bottom: 0;
    }

    .scroll-indicator::before {
      content: "";
      position: absolute;
      top: 15px;
      left: 50%;
      width: 8px;
      height: 8px;
      background: #fff;
      border-radius: 50%;
      transform: translateX(-50%);
      animation: scroll 1.5s infinite;
    }

    @keyframes scroll {
      0% { opacity: 0; transform: translate(-50%, 0); }
      30% { opacity: 1; }
      70% { opacity: 1; transform: translate(-50%, 30px); }
      100% { opacity: 0; transform: translate(-50%, 40px); }
    }

    .arrow {
      position: absolute;
      bottom: -25px;
      left: 50%;
      transform: translateX(-50%);
      width: 0; 
      height: 0; 
      border-left: 10px solid transparent;
      border-right: 10px solid transparent;
      border-top: 12px solid #fff;
      animation: bounce 1.5s infinite;
    }

    @keyframes bounce {
      0%, 100% { transform: translate(-50%, 0); }
      50% { transform: translate(-50%, 8px); }
    }