/* CSS Umum dan Halaman Depan */

        .hero-section {

            background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://www.retrorun.co.id/wp-content/uploads/2022/10/21.-Jasa-Pengiriman-Barang-Terbaik-di-Indonesia.jpg') no-repeat center center;

            background-size: cover;

            color: #fff;

            padding: 120px 0;

            text-align: center;

        }

        .hero-section h1 {

            font-weight: 700;

            font-size: clamp(2.5rem, 5vw, 4rem);

            text-shadow: 2px 2px 8px rgba(0,0,0,0.6);

        }

        .action-bar {

            background-color: #fff;

            padding: 2rem;

            margin-top: -80px;

            position: relative;

            z-index: 10;

            border-radius: 1rem;

            box-shadow: 0 10px 30px rgba(0,0,0,0.1);

        }

        .action-card {

            border: none;

            background-color: #f8f9fa;

            padding: 1.5rem;

            border-radius: 0.75rem;

            transition: all 0.3s ease;

            height: 100%;

        }

        .action-card:hover {

            transform: translateY(-5px);

            box-shadow: 0 5px 15px rgba(0,0,0,0.07);

        }

        .section {

            padding: 80px 0;

        }

        .section-title {

            font-weight: 700;

            margin-bottom: 50px;

            text-align: center;

            color: #1a2a46;

        }

      

      .hero-section {

            background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), url('https://www.retrorun.co.id/wp-content/uploads/2022/10/21.-Jasa-Pengiriman-Barang-Terbaik-di-Indonesia.jpg') no-repeat center center;

            background-size: cover;

            color: #fff;

            padding: 120px 0;

            text-align: center;

        }

        .hero-section h1 {

            font-weight: 700;

            font-size: clamp(2.5rem, 5vw, 3.5rem);

            text-shadow: 2px 2px 8px rgba(0,0,0,0.6);

        }

        .section {

            padding: 80px 0;

        }

        .section-title {

            font-weight: 700;

            margin-bottom: 50px;

            text-align: center;

            color: #1a2a46;

        }

        .service-card {

            background: #fff;

            border: none;

            border-radius: 15px;

            padding: 30px;

            text-align: center;

            box-shadow: 0 10px 30px rgba(0,0,0,0.07);

            transition: all 0.3s ease;

            height: 100%;

        }

        .service-card:hover {

            transform: translateY(-10px);

        }

        .service-card .icon {

            font-size: 48px;

            color: #0d6efd;

            margin-bottom: 20px;

        }



.partner-logo-card {

        padding: 1rem;

        background: #fff;

        border-radius: 1rem;

        box-shadow: 0 4px 15px rgba(0,0,0,0.05);

        text-align: center;

        transition: all 0.3s ease;

        height: 100%;

        display: flex;

        align-items: center;

        justify-content: center;

    }

    .partner-logo-card:hover {

        transform: translateY(-5px);

        box-shadow: 0 8px 25px rgba(0,0,0,0.1);

    }

    .partner-logo-card img {

        max-height: 40px;

        width: auto;

        max-width: 100%;

        object-fit: contain;

        filter: grayscale(100%);

        opacity: 0.6;

        transition: all 0.3s ease;

    }

    .partner-logo-card:hover img {

        filter: grayscale(0%);

        opacity: 1;

    }





        .testimonial-card {

            background-color: #fff;

            border: none;

            border-radius: 15px;

            box-shadow: 0 4px 25px rgba(0,0,0,0.08);

            padding: 30px;

            height: 100%;

            display: flex;

            flex-direction: column;

        }

        .testimonial-card p {

            flex-grow: 1;

        }

        

        /* CSS untuk Autocomplete */

        .autocomplete-container { position: relative; }

        .autocomplete-results { position: absolute; top: 100%; left: 0; right: 0; background: white; border: 1px solid #ddd; border-top: none; max-height: 200px; overflow-y: auto; z-index: 1056; }

        .autocomplete-item { padding: 10px; cursor: pointer; }

        .autocomplete-item:hover { background-color: #f0f0f0; }

        .autocomplete-results div.loading { padding: 10px; font-style: italic; color: #888; }

        

        /* CSS untuk Floating Buttons */

        .floating-btn {

            position: fixed;

            width: 50px;

            height: 50px;

            border-radius: 50%;

            color: #FFF;

            text-align: center;

            font-size: 24px;

            box-shadow: 2px 2px 8px rgba(0,0,0,0.25);

            z-index: 1000;

            display: flex;

            align-items: center;

            justify-content: center;

            text-decoration: none;

            transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;

        }

        .wa-float {

            bottom: 40px;

            left: 30px; /* Posisi di kiri */

            background-color: #25d366;

        }

        .scroll-to-top {

            bottom: 40px;

            right: 30px; /* Posisi di kanan */

            background-color: #0d6efd;

            opacity: 0; /* Sembunyikan secara default */

            transform: translateY(100px); /* Mulai dari bawah layar */

        }

        .scroll-to-top.show {

            opacity: 1;

            transform: translateY(0); /* Muncul ke posisi normal */

        }