.material-symbols-outlined {
      font-variation-settings: 'FILL' 0,'wght' 400,'GRAD' 0,'opsz' 24;
    }

    body {
      min-height: max(884px, 100dvh);
    }

    .nav-item {
      opacity: 0;
      transform: translateY(-20px);
      transition: all 0.4s ease;
    }

    .nav-item::after {
      content: "";
      position: absolute;
      left: 0;
      bottom: -5px;
      width: 0%;
      height: 2px;
      background: #006633;
      transition: 0.3s;
    }

    .nav-item:hover::after {
      width: 100%;
    }

    /* HEADER SCROLL */
    #mainHeader {
      transition: transform 0.3s ease;
    }

    #mainHeader.header-hidden {
      transform: translateY(-100%);
    }

    #heroSection {
      transition: margin-top 0.3s ease;
    }

    #heroSection.hero-top {
      margin-top: 0;
    }

    /* ==========================
          SCROLL TO TOP
    ========================== */

    #scrollTopBtn{
        transform: translateY(20px);
    }

    #scrollTopBtn.show{
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    #scrollTopBtn:hover{
        box-shadow: 0 10px 25px rgba(0,0,0,.25);
    }

    .hero-title{
        display: inline-block;
        white-space: nowrap;
        animation: slideLoop 8s ease-in-out infinite;
    }

    /* Masuk → Diam 3 detik → Keluar → Ulang */
    @keyframes slideLoop{

        /* Mulai di luar kanan */
        0%{
            opacity: 0;
            transform: translateX(120%);
        }

        /* Masuk */
        15%{
            opacity: 1;
            transform: translateX(0);
        }

        /* Diam sekitar 3 detik */
        55%{
            opacity: 1;
            transform: translateX(0);
        }

        /* Keluar ke kiri */
        75%{
            opacity: 0;
            transform: translateX(-180%);
        }

        /* Tetap di luar kiri sebelum reset */
        100%{
            opacity: 0;
            transform: translateX(-180%);
        }
    }

        .text-justify {
        text-align: justify;
    }

    /* Tinggi mengikuti class h-[700px] pada HTML, sama seperti hero Aduan. */
    #heroSection {
      transition: margin-top 0.3s ease;
    }