
        body {
            font-family: 'Urbanist', sans-serif;
            background-color: #0F0F10;
        }
        .mesh-gradient-bg {
            background: radial-gradient(circle at 50% 50%, rgba(191, 43, 56, 0.15) 0%, transparent 50%),
                        radial-gradient(circle at 0% 0%, rgba(191, 43, 56, 0.1) 0%, transparent 30%),
                        radial-gradient(circle at 100% 100%, rgba(191, 43, 56, 0.1) 0%, transparent 30%);
        }
        .pricing-card-glow:hover {
            box-shadow: 0 0 30px rgba(191, 43, 56, 0.3);
            border-color: #bf2b38;
        }
        .package-category-filter {
            width: fit-content;
            max-width: 100%;
        }
        .package-category-section {
            padding-top: 1rem;
        }
        .package-category-trigger,
        .package-category-modal {
            display: none;
        }
        .package-category-modal.hidden {
            display: none !important;
        }
        [id^="paket-"] {
            position: relative;
            background-color: #1E1E1E;
            border-radius: 1.5rem;
        }
        [id^="paket-"].border-primary,
        [id^="paket-"][class*="border-primary"] {
            border-color: #bf2b38 !important;
            box-shadow: 0 24px 70px rgba(191, 43, 56, 0.16);
        }
        [id^="paket-"] > .absolute[class*="-top-4"] {
            position: absolute !important;
            top: -1rem !important;
            left: 50% !important;
            transform: translateX(-50%) !important;
            z-index: 5;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            border-radius: 999px;
            background: #bf2b38 !important;
            color: #fff !important;
            padding: 0.25rem 1rem;
            font-size: 0.75rem;
            font-weight: 900;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            white-space: nowrap;
            box-shadow: 0 14px 32px rgba(191, 43, 56, 0.28);
        }

        @media (max-width: 767px) {
            .package-category-section {
                padding-top: 1.25rem !important;
                padding-bottom: 1.35rem !important;
            }

            .package-category-section + section {
                padding-top: 1rem !important;
            }

            .package-category-filter {
                display: none !important;
            }

            .package-category-trigger {
                display: flex;
                width: 100%;
                align-items: center;
                justify-content: space-between;
                gap: 0.75rem;
                min-height: 3.4rem;
                border: 1px solid rgba(255, 255, 255, 0.10);
                border-radius: 1.1rem;
                background:
                    linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.035)),
                    rgba(30, 30, 30, 0.72);
                color: #fff;
                padding: 0.8rem 0.95rem;
                box-shadow: 0 18px 44px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.08);
                backdrop-filter: blur(18px);
                font-size: 0.92rem;
                font-weight: 900;
            }

            .package-category-trigger > span:not(.material-symbols-outlined) {
                margin-right: auto;
            }

            .package-category-trigger small {
                max-width: 42%;
                overflow: hidden;
                color: #94a3b8;
                font-size: 0.68rem;
                font-weight: 800;
                line-height: 1;
                text-align: right;
                text-overflow: ellipsis;
                text-transform: uppercase;
                white-space: nowrap;
            }

            .package-category-modal.is-open {
                position: fixed;
                inset: 0;
                z-index: 1200;
                display: flex;
                align-items: flex-end;
                justify-content: center;
                background: rgba(0, 0, 0, 0.68);
                padding: 1rem;
                backdrop-filter: blur(10px);
            }

            .package-category-modal__panel {
                width: 100%;
                max-height: min(74vh, 34rem);
                overflow: hidden;
                border: 1px solid rgba(255, 255, 255, 0.12);
                border-radius: 1.5rem;
                background:
                    radial-gradient(circle at 20% 0%, rgba(191, 43, 56, 0.20), transparent 36%),
                    linear-gradient(180deg, rgba(20, 20, 22, 0.98), rgba(10, 10, 12, 0.98));
                box-shadow: 0 28px 90px rgba(0, 0, 0, 0.56);
            }

            .package-category-modal__head {
                display: flex;
                align-items: flex-start;
                justify-content: space-between;
                gap: 1rem;
                border-bottom: 1px solid rgba(255, 255, 255, 0.08);
                padding: 1.15rem;
            }

            .package-category-modal__head p {
                margin: 0 0 0.35rem;
                color: #bf2b38;
                font-size: 0.68rem;
                font-weight: 950;
                letter-spacing: 0.16em;
                text-transform: uppercase;
            }

            .package-category-modal__head h3 {
                margin: 0;
                color: #fff;
                font-size: 1.25rem;
                font-weight: 950;
                letter-spacing: -0.03em;
            }

            .package-category-modal__close {
                display: inline-flex;
                width: 2.5rem;
                height: 2.5rem;
                flex: 0 0 auto;
                align-items: center;
                justify-content: center;
                border: 1px solid rgba(255, 255, 255, 0.10);
                border-radius: 0.9rem;
                background: rgba(255, 255, 255, 0.06);
                color: #fff;
            }

            .package-category-modal__list {
                display: grid;
                max-height: calc(min(74vh, 34rem) - 5.2rem);
                gap: 0.65rem;
                overflow-y: auto;
                padding: 1rem;
            }

            .package-category-modal__list > a {
                display: flex;
                align-items: center;
                justify-content: space-between;
                gap: 1rem;
                border: 1px solid rgba(255, 255, 255, 0.08);
                border-radius: 1rem;
                background: rgba(255, 255, 255, 0.045);
                color: #fff;
                padding: 0.9rem 1rem;
                text-decoration: none;
            }

            .package-category-modal__list > a.is-active {
                border-color: rgba(191, 43, 56, 0.55);
                background: linear-gradient(135deg, rgba(191, 43, 56, 0.95), rgba(142, 31, 41, 0.92));
                box-shadow: 0 14px 34px rgba(191, 43, 56, 0.24);
            }

            .package-category-modal__list span {
                min-width: 0;
                overflow: hidden;
                font-size: 0.95rem;
                font-weight: 900;
                text-overflow: ellipsis;
                white-space: nowrap;
            }

            .package-category-modal__list small {
                flex: 0 0 auto;
                color: #94a3b8;
                font-size: 0.68rem;
                font-weight: 800;
                white-space: nowrap;
            }

            .package-category-modal__list > a.is-active small {
                color: rgba(255, 255, 255, 0.78);
            }

            .package-category-filter {
                width: calc(100vw - 2rem);
                max-width: 100%;
                margin-left: auto;
                margin-right: auto;
                display: flex;
                flex-wrap: nowrap !important;
                justify-content: flex-start;
                gap: 0.5rem;
                overflow-x: auto;
                overflow-y: hidden;
                padding: 0.45rem;
                border-radius: 1rem;
                scroll-snap-type: x proximity;
                -webkit-overflow-scrolling: touch;
                scrollbar-width: none;
            }

            .package-category-filter::-webkit-scrollbar {
                display: none;
            }

            .package-category-filter > a {
                flex: 0 0 auto;
                min-width: max-content;
                max-width: 78vw;
                padding: 0.72rem 0.95rem;
                text-align: center;
                white-space: nowrap;
                line-height: 1;
                font-size: 0.82rem;
                border-radius: 0.8rem;
                scroll-snap-align: start;
            }

            [id^="paket-"].scale-105,
            [id^="paket-"][class*="scale-105"] {
                transform: none !important;
            }

            [id^="paket-"] {
                padding: 1.5rem;
            }
        }
    
