.bg-utama {
            background:
            radial-gradient(100% 100% at 100% 0%, #A9E2E1 0%, rgba(169, 226, 225, 0) 100%),
            radial-gradient(100% 100% at 0% 0%, #D9ECCB 0%, rgba(217, 236, 203, 0) 100%),
            #F6FAF2;
        }

        .btn-outline-success:hover,
        .btn-outline-success:focus {
            background: #21867a;
            color: #fff;
            border-color: #21867a;
            box-shadow: 0 2px 12px rgba(33, 134, 122, 0.08);
        }

        .fitur-card {
            border-radius: 20px;
            background: #fff;
            box-shadow: 0 4px 24px 0 rgba(25, 109, 107, 0.07);
            border: none;
            overflow: hidden;
            position: relative;
        }

        .fitur-card:hover {
            box-shadow: 0 8px 32px 0 rgba(25, 109, 107, 0.13);
        }

        .fitur-img {
            border-radius: 16px 16px 0 0;
            object-fit: cover;
            width: 100%;
            height: 180px;
            transition: transform 0.4s cubic-bezier(.4, 2, .6, 1);
        }

        .fitur-card:hover .fitur-img {
            transform: scale(1.08);
        }

        .fitur-badge {
            display: inline-block;
            font-size: 0.85rem;
            font-weight: 600;
            border-radius: 12px;
            padding: 2px 14px;
            margin-right: 4px;
            margin-bottom: 6px;
            color: #fff;
        }

        .badge-kasir {
            background: #FFBC22;
        }

        .badge-karyawan {
            background: #81CF77;
        }

        .badge-inventori {
            background: #196D6B;
        }

        .badge-owner {
            background: #A259FF;
        }

        .badge-analisa {
            background: #00B8D9;
        }

        .badge-akuntansi {
            background: #00C48C;
        }

        .badge-toko {
            background: #FF6B6B;
        }

        .badge-crm {
            background: #4F8CFF;
        }

        .fitur-badge {
            box-shadow: 0 2px 8px rgba(25, 109, 107, 0.08);
        }

        .fitur-card .card-body {
            padding: 1.5rem 1.2rem 1.2rem 1.2rem;
        }

        .fitur-card h5 {
            min-height: 56px;
        }

        .btn-hubungi-kami {
            border: 2px solid #1CB39B;
            color: #1CB39B;
            background: #fff;
            font-size: 1rem;
        }

        .btn-hubungi-kami:hover {
            background: #1CB39B;
            color: #fff;
        }

        .btn-jadwalkan-demo {
            background: linear-gradient(135deg, #1CB39B 0%, #81CF77 100%);
            color: #fff;
            font-size: 1rem;
        }

        .btn-jadwalkan-demo:hover {
            background: #81CF77;
            color: #fff;
        }

        .brand-marquee-wrapper {
            position: relative;
            width: 100%;
            overflow: hidden;
            padding: 1rem 0;
        }

        .brand-marquee {
            display: flex;
            align-items: center;
            animation: marquee 18s linear infinite;
        }

        @keyframes marquee {
            0% {
                transform: translateX(0);
            }

            100% {
                transform: translateX(-50%);
            }
        }

        .brand-marquee img {
            height: 60px;
            object-fit: contain;
            background: transparent;
            transition: transform 0.2s;
        }

        .brand-marquee img:hover {
            transform: scale(1.08);
        }

        @media (max-width: 768px) {
            .brand-marquee img {
                height: 40px;
                margin-left: 1.5rem !important;
                margin-right: 1.5rem !important;
            }
        }

        .btn-pilih-paket {
            background: linear-gradient(90deg, #1CB39B 0%, #81CF77 100%);
            color: #fff;
            font-weight: bold;
            box-shadow: 0 2px 8px rgba(28, 179, 155, 0.08);
            border: none;
            transition: background 0.2s, color 0.2s, box-shadow 0.2s;
        }

        .btn-pilih-paket:hover,
        .btn-pilih-paket:focus {
            background: linear-gradient(90deg, #81CF77 0%, #1CB39B 100%);
            color: #fff;
            box-shadow: 0 4px 16px rgba(28, 179, 155, 0.18);
        }

        .btn-hubungi-paket {
            border: 2px solid #1CB39B;
            color: #1CB39B;
            background: #fff;
            font-weight: bold;
            transition: background 0.2s, color 0.2s, border-color 0.2s;
        }

        .btn-hubungi-paket:hover,
        .btn-hubungi-paket:focus {
            background: #1CB39B;
            color: #fff;
            border-color: #1CB39B;
        }


        .kenapa-title {
            color: #19706B;
            font-weight: 700;
            font-size: 2.5rem;
            margin-bottom: 0.5rem;
        }

        .kenapa-card {
            background: #fff;
            border-radius: 18px;
            box-shadow: 0 2px 16px 0 rgba(25, 109, 107, 0.07);
            padding: 1.5rem 1.2rem;
            margin-bottom: 1.5rem;
            display: flex;
            align-items: flex-start;
            gap: 1.2rem;
            transition: box-shadow 0.2s, transform 0.2s;
        }

        .kenapa-card:hover {
            box-shadow: 0 8px 32px 0 rgba(25, 109, 107, 0.13);
            transform: translateY(-4px) scale(1.03);
        }

        .kenapa-card-icon {
            font-size: 2.2rem;
            flex-shrink: 0;
        }

        .kenapa-card-title {
            font-weight: bold;
            font-size: 1.15rem;
            margin-bottom: 0.3rem;
        }

        .kenapa-card-desc {
            color: #4B5C6B;
            font-size: 1rem;
        }

        @media (max-width: 991px) {
            .kenapa-section {
                padding: 1.5rem 0.5rem;
                border-radius: 18px;
            }

            .kenapa-title {
                font-size: 2rem;
            }
        }

.brand-marquee {
    display: flex;
    flex-wrap: wrap;
    justify-content: center; /* Center all logos */
    gap: 30px; /* Equal spacing */
    padding: 20px 0;
}

.brand-box {
    width: 150px;  /* Same size box */
    height: 150px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
}

.brand-box:hover {
    transform: scale(1.05);
}

.brand-box img {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain; /* Keeps proportions */
}