body {
            font-family: "Poppins", sans-serif;
            padding-top: 56px;
			padding-bottom: 80px; /* beri ruang agar konten tidak tertutup tombol */
			}
			
			/* Sidebar styles */
			.sidebar {
            position: fixed;
            top: 0;
            left: -250px;
            width: 250px;
            height: 100%;
            background-color: #fff;
            transition: left 0.3s ease;
            padding-top: 60px;
            z-index: 1050;
            box-shadow: 2px 0 5px rgba(0,0,0,0.1);
			}
			
			.sidebar.show {
            left: 0;
			}
			
			.overlay {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.3);
            display: none;
            z-index: 1040;
			}
			
			.overlay.show {
            display: block;
			}
			
			.sidebar a {
            padding: 10px 20px;
            display: block;
            color: #212529;
            text-decoration: none;
			}
			
			.sidebar a:hover {
            background-color: rgba(0, 0, 0, 0.05);
			}
			
			.menu-item {
            display: flex;
            align-items: center;
            gap: 10px;
			}
			
			.menu-item i {
            width: 20px;
            text-align: center;
			}
			
			.submenu-item {
            padding-left: 30px !important;
            display: flex;
            align-items: center;
            gap: 10px;
			}
			
			/* Search box styles */
			.search-box {
            position: relative;
			}
			
			.search-box input {
            padding-left: 2rem;
            min-width: 200px;
			}
			
			.search-box .bi-search {
            position: absolute;
            top: 50%;
            left: 10px;
            transform: translateY(-50%);
            color: #888;
			}
			
			/* Mobile search box */
			.mobile-search-container {
            position: fixed;
            top: 56px;
            left: 0;
            width: 100%;
            background: white;
            padding: 10px 15px;
            box-shadow: 0 2px 5px rgba(0,0,0,0.1);
            display: none;
            z-index: 1030;
			}
			
			.mobile-search-container.show {
            display: block;
			}
			
			/* Navbar adjustments */
            .navbar {
                position: fixed !important;
                top: 0;
                left: 0;
                right: 0;
                z-index: 1045; /* naikkan sedikit agar di atas overlay dan search */
            }
            
            .mobile-search-container {
                position: fixed;
                top: 56px;
                left: 0;
                width: 100%;
                background: white;
                padding: 10px 15px;
                box-shadow: 0 2px 5px rgba(0,0,0,0.1);
                display: none;
                z-index: 1040; /* lebih rendah dari navbar tapi di atas konten */
            }
			
			/* User dropdown styles */
    			.user-avatar {
                width: 32px;
                height: 32px;
                border-radius: 50%;
                background-color: #0d6efd;
                color: white;
                display: flex;
                align-items: center;
                justify-content: center;
                font-size: 14px;
                font-weight: 500;
			}
			
			.user-menu {
            min-width: 200px;
			}
			
			/* Desktop layout */
			@media (min-width: 768px) {
                .navbar-brand {
    			margin-right: 2rem;
                }
                
                .navbar-nav {
    			flex: 1;
    			justify-content: center;
                }
                
                .nav-right {
    			margin-left: auto;
    			display: flex;
    			align-items: center;
    			gap: 10px;
                }
                
                #toggleSidebar,
                #mobileSearchBtn {
    			display: none !important;
                }
                
                .mobile-search-container {
    			display: none !important;
                }
			}
			button:focus,
button:active {
    outline: none !important;
    box-shadow: none !important;
}

.icon-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border: none;
    border-radius: 8px;
    background: none;
    color: black;
    padding: 0;
}

.icon-btn i {
    font-size: 1.4rem; /* ukuran seragam */
}
			/* Mobile layout */
@media (max-width: 767px) {
    .navbar-brand {
        position: relative;   /* ubah jadi relative */
        left: 0;
        transform: none;      /* hilangkan centering */
        margin-right: auto !important;
    }

    .desktop-search,
    .navbar-nav {
        display: none !important;
    }

    .nav-right {
        margin-left: auto;
    }

    .mobile-search-container .search-box input {
        width: 100%;
    }

    .user-dropdown {
        display: none;
    }
}
#cartIcon {
    display: inline-block;
    position: relative;
    transform-origin: center;
    will-change: transform;
}

#cartCountBadge {
    position: absolute;
    top: -4px;
    right: -6px;

    width: 18px;
    height: 18px;

    display: flex;
    justify-content: center;
    align-items: center;

    background: red;
    color: #fff;
    border-radius: 50%;

    font-size: 10px;
    font-weight: 600;
}

#cartCountBadge.hidden {
    display: none;
}


			/* pastikan ikon bisa di-transform */
			#cartIcon { display:inline-block; transform-origin:center; will-change:transform; }
			
			@keyframes cart-shake {
			0% { transform: rotate(0deg) scale(1); }
			15% { transform: rotate(-12deg) scale(1.05); }
			30% { transform: rotate(12deg) scale(1.05); }
			45% { transform: rotate(-8deg) scale(1.02); }
			60% { transform: rotate(8deg) scale(1.02); }
			75% { transform: rotate(-4deg) scale(1); }
			100% { transform: rotate(0deg) scale(1); }
			}
			.cart-shake { animation: cart-shake .6s ease; }
			
			
			/* Tambahkan ini di bagian CSS Anda */
			.form-control {
            background-color: #fff !important;
            color: #212529 !important;
            border: 1px solid #ced4da !important;
			}
			
			/* Untuk input di sidebar */
			.sidebar .form-control {
            background-color: #fff !important;
            color: #212529 !important;
			}
			
			/* Untuk input di mobile search */
			.mobile-search-container .form-control {
            background-color: #fff !important;
			}

			.suggestion-box .list-group-item {
			max-width: 100%;
			}
			
			.suggestion-box .list-group-item .flex-grow-1 {
			min-width: 0; /* penting supaya flex + ellipsis jalan */
			}
			
			.suggestion-box .list-group-item div:first-child {
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			}
            /* Efek blur & fade untuk overlay search */
            .search-overlay-blur {
            	position: fixed;
            	inset: 0;
            	backdrop-filter: blur(6px);
            	background-color: rgba(255,255,255,0.4);
            	opacity: 0;
            	transition: opacity 0.3s ease;
            	z-index: 1035; /* di bawah navbar tapi di atas konten */
            	pointer-events: none; /* biar tidak blok interaksi kalau invisible */
            }
            
            .search-overlay-blur.show {
            	opacity: 1;
            	pointer-events: auto;
            }
            /* Navbar tidak ikut terdorong di mobile */
            @media (max-width: 768px) {
            	.navbar {
            		position: sticky;
            		top: 0;
            		padding: 3px;
            		z-index: 1050;
            	}
            }
            a {
                text-decoration: none;
            }
            
            .subheadline {
              font-size: 0.9rem;   /* ukuran kecil */
              color: #6c757d;      /* sama seperti text-muted */
              line-height: 1.5;
            }

/* DEFAULT = MOBILE */
.hero-section {
    background: 
        linear-gradient(to bottom, rgba(0,0,0,0.65), rgba(0,0,0,0.65)),
        url('/img/hik-banner-2-mobile.png');
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    padding: 40px 20px;
    color: white;
}

.hero-content {
    max-width: 90%;
}

/* MOBILE */
@media (max-width: 767px) {
    .hero-section {
        height: 65vh;
    }
}

/* DESKTOP */
@media (min-width: 768px) {
    .hero-section {
        height: 350px;
    }
}

/* DESKTOP */
@media (min-width: 768px) {
    .hero-section {
        background:
            linear-gradient(rgba(0,0,0,0.6), rgba(0,0,0,0.6)),
            url('/img/hik-banner-2.png');
        height: 400px;
    }
}

			.brand-logo {
			height: 60px;
			object-fit: contain;
			filter: grayscale(100%);
			transition: all 0.3s;
			}
			.brand-logo:hover { filter: grayscale(0%); }
			
/* ================================
   CARD — GLOBAL (MOBILE & DESKTOP)
   ================================ */

/* Struktur card konsisten */
.card {
    border-radius: 12px;
    overflow: hidden;
}

/* Agar tinggi card seragam */
.card.h-100 {
    height: 100%;
}
    /* Animasi hover card */
    .card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.12);
        transition: 0.25s ease;
    }
/* Card body — flex layout */
.card .card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: .75rem !important;
    font-size: 14px;
}

/* ================================
   TITLE — MULTILINE CLAMP
   ================================ */

/* Wrapper agar tidak terpengaruh flex */
.product-title {
    display: block;
}

/* Judul produk — clamp 2 baris */
.product-title .card-text {
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.4;
    max-height: 2.8em;  /* 1.4 * 2 baris */
    min-height: 2.8em;
}

/* Jika user memasukkan <small> ke dalam card-text, tetap stabil */
.product-title small {
    display: inline;
    font-size: .85rem;
}

/* ================================
   RIBBON DISKON
   ================================ */
.ribbon {
    font-size: .7rem;
    padding: 3px 8px;
    border-radius: 0 .4rem .4rem 0;
    z-index: 10;
}

/* ================================
   PRICE
   ================================ */
.price {
    font-size: .95rem;
}

/* ================================
   BRAND LOGO
   ================================ */
.brand-logo {
    height: 16px;
    width: auto;
    max-width: 60px;
    object-fit: contain;
    opacity: .85;
    transition: .3s ease;
}

/* ================================
   DESKTOP ONLY — HOVER & ANIMASI
   ================================ */
@media (min-width: 768px) {

    /* Brand logo hover */
    .brand-logo:hover {
        opacity: 1;
        filter: grayscale(0);
    }

    /* Brand link */
    .brand-link {
        display: block;
        transition: transform .3s ease;
    }
    .brand-link:hover {
        transform: scale(1.07);
        text-decoration: none;
    }
}

	.category-card-premium {
		border: 0;
		border-radius: 18px;
		overflow: hidden;
		transition: all .25s ease;
		background: #ffffff;
		position: relative;
	}

	.category-card-premium:hover {
		transform: translateY(-6px);
		box-shadow: 0 10px 25px rgba(0,0,0,0.10);
	}

	.category-img-wrapper {
		height: 90px;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #f8f9fa;
	}

	.category-img-wrapper img {
		max-height: 60px;
		object-fit: contain;
		transition: .2s ease;
	}

	.category-card-premium:hover img {
		transform: scale(1.10);
	}

	.category-title {
		font-size: 15px;
		font-weight: 600;
		color: #333;
		margin-top: 6px;
	}
		/* Default: tampilkan thumbnail */
			#thumbnail-slider {
			display: block;
			}
			
			/* Sembunyikan thumbnail di layar mobile */
			@media (max-width: 767px) {
			#thumbnail-slider {
			display: none !important;
			}
			}
			
			#thumbnail-slider .splide__track {
			overflow-x: auto;
			overflow-y: hidden;
			}
			
			#thumbnail-slider .splide__list {
			display: flex !important;
			flex-direction: row !important;
			}
			
			.thumbnail-slider {
			margin-top: 10px;
			}
			
			.thumbnail-slider .splide__slide {
			opacity: 0.5;
			cursor: pointer;
			padding: 4px;
			}
			
			.thumbnail-slider .splide__slide.is-active {
			opacity: 1;
			border: 1px solid #007bff;
			border-radius: 6px;
			}
			
			
			/* Membuat kotak proporsional */
			.square-wrapper {
			position: relative;
			width: 100%;
			padding-top: 100%; /* rasio 1:1 */
			overflow: hidden;
			border-radius: 0; /* atur radius kalau mau */
			}
			
			/* Gambar isi penuh tanpa distorsi */
			.square-wrapper img {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: contain;
			}
			.share-wrapper {
			position: relative;
			}
			
			#shareToggle {
            width: 30px;
            height: 30px;
            background-color: #9faebd;
            color: white;
            border: none;
            border-radius: 50%;
            display: flex;
            justify-content: center;
            align-items: center;
            transition: all 0.3s ease;
            cursor: pointer;
			}
			
			#shareToggle:hover {
            background-color: #0056b3;
            transform: scale(1.1);
			}			
			.share-menu {
			display: none;
			position: absolute;
			top: 110%;
			left: 0;
			background: white;
			border: 1px solid #ccc;
			border-radius: 8px;
			padding: 8px;
			box-shadow: 0 2px 6px rgba(0,0,0,0.1);
			z-index: 10;
			white-space: nowrap;
			}
			
			.share-menu a,
			.share-menu button.copy-link {
			display: inline-block;
			padding: 6px;
			color: #333;
			text-decoration: none;
			background: transparent;
			border: none;
			font-size: 16px;
			cursor: pointer;
			transition: color 0.3s;
			}
			
			.share-menu a:hover,
			.share-menu button.copy-link:hover {
			color: #007bff;
			}
			
			.product-detail table {
			margin: 15px 0;
			width: 100%;
			}
			.product-detail th {
			width: 50%;
			}
			.product-detail td {
			font-size: 12px;
			margin: 0 10px;
			padding: 10px 0;
			text-align: right;
			}
			.product-detail tr {
			border-bottom: 1px solid #ccc;
			}
			
.product-detail-description {
    position: relative;
}

/* hilangkan bullet list default */
.product-detail-description ul,
.product-detail-description ol {
    list-style: none;
    padding-left: 0;
    margin: 0;
}

/* line-height default */
.description-short,
.description-full {
    line-height: 1.5;
    margin-bottom: 5px;
}

/* khusus short → hindari jarak besar antar baris */
.description-short br {
    line-height: 0; 
    margin: 0;
    padding: 0;
    display: block;
}

/* tombol readmore */
.description-toggle {
    color: #007bff;
    cursor: pointer;
    display: inline-block;
    margin-top: 5px;
    text-decoration: none;
}

			

			
			.opsi {
			border-radius: 10px;
			}
			
			/* CSS versi kecil */
			.btn-group-scroll {
			display: flex;
			overflow-x: auto;
			padding-bottom: 0.5rem;
			gap: 0.5rem;
			-webkit-overflow-scrolling: touch; /* smooth scroll di iOS */
			
			/* SOLUSI GARIS HITAM: */
			background-color: #fff; /* ganti dengan warna latar belakang container kamu */
			border: none;
			box-shadow: none;
			/* Tambahan: hilangkan scrollbar (opsional) */
			scrollbar-width: none; /* Firefox */
			}
			
			.btn-group-scroll::-webkit-scrollbar {
			display: none; /* Chrome, Safari */
			}
			.btn-group-scroll .btn {
			white-space: nowrap;
			flex: 0 0 auto;
			padding: 0.375rem 0.75rem;
			font-size: 0.9rem;
			}
			#info-pasang {
			font-size: 0.75rem; /* atau ukuran yang diinginkan */
			}
			#pilih-hdd {
			font-size: 0.75rem; /* atau ukuran yang diinginkan */
			}	
			
			/* Rating Stars */
			.rating-stars {
			display: inline-block;
			position: relative;
			font-size: 1.5rem;
			unicode-bidi: bidi-override;
			direction: rtl;
			}
			
			.rating-stars input {
			opacity: 0;
			position: absolute;
			left: -9999px;
			}
			
			.rating-stars label {
			color: #ddd;
			cursor: pointer;
			display: inline-block;
			margin: 0 2px;
			transition: all 0.2s;
			}
			
			.rating-stars label:hover,
			.rating-stars label:hover ~ label,
			.rating-stars input:checked ~ label {
			color: #ffc107;
			}
			
			/* Animasi bintang */
			@keyframes pulse {
			0% { transform: scale(1); }
			50% { transform: scale(1.3); }
			100% { transform: scale(1); }
			}
			
			.rating-stars .animated-star {
			animation: pulse 0.5s;
			display: inline-block;
			}
			
			/* Review card */
			.review-card {
			border-left: 4px solid #ffc107;
			transition: all 0.3s;
			}
			
			.review-card:hover {
			transform: translateY(-3px);
			box-shadow: 0 5px 15px rgba(0,0,0,0.1);
			}
			
			/* Rating summary */
			.rating-summary {
			background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
			border-radius: 10px;
			}
			.rating-stars {
			unicode-bidi: bidi-override;
			direction: rtl;
			display: inline-flex;
			}
			
			.rating-stars input {
			display: none;
			}
			
			.rating-stars label {
			font-size: 1.5em;
			color: #ccc;
			cursor: pointer;
			}
			
			.rating-stars label::before {
			content: "★";
			}
			
			.rating-stars input:checked ~ label::before,
			.rating-stars input:checked ~ label {
			color: #ffc107; /* warna bintang saat dipilih */
			}
			
			.rating-stars input:hover ~ label::before,
			.rating-stars label:hover ~ label::before {
			color: #ffca2c; /* warna saat hover */
			}
			.wishlist-btn {
			border: none;
			background: none;
			cursor: pointer;
			transition: transform 0.2s ease;
			}
			.wishlist-btn:focus,
			.wishlist-btn:active {
			outline: none !important;
			box-shadow: none !important;
			border: none !important;
			}			
			.wishlist-btn:hover {
			transform: scale(1.1);
			}
			
			.wishlist-btn.active i {
			color: red;
			}
			.fixed-bottom-action {
			position: fixed;
			bottom: 0;
			left: 0;
			right: 0;
			z-index: 1030;
			}

			/* Layout utama 50-50 untuk product-detail */
			.product-detail {
			display: flex;
			flex-wrap: wrap;
			gap: 30px;
			width: 100%;
			}
			.splide__slide img {
			width: 100%;
			height: 100%;
			object-fit: cover;
			border-radius: 10px;
			}
			/* Bagian slider gambar (50%) */
			.product-detail > .slider-wrapper {
			flex: 1;
			min-width: 300px;
			max-width: 100%;
			}
			
			/* Bagian deskripsi produk (50%) */
			.product-detail > .product-description {
			flex: 1;
			min-width: 300px;
			max-width: 100%;
			}
			
			/* Responsive layout untuk layar besar */
			@media (min-width: 992px) {
			.product-detail > .slider-wrapper,
			.product-detail > .product-description {
			flex: 0 0 calc(50% - 15px);
			max-width: calc(50% - 15px);
			}
			}
			
/* === Bottom Sheet mode – khusus mobile === */
@media (max-width: 767px) {

    /* Matikan posisi center Bootstrap */
    #shareModal .modal-dialog-centered {
        align-items: flex-end !important;
        min-height: 100%;
    }

    /* Dialog jadi fixed bottom */
    #shareModal .modal-dialog {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0;
        transform: translateY(100%);
        transition: transform .3s ease-out;
    }

    /* Ketika modal muncul → naik ke atas */
    #shareModal.show .modal-dialog {
        transform: translateY(0);
    }

    /* Style bottom-sheet */
    #shareModal .modal-content {
        border-radius: 1rem 1rem 0 0;
        box-shadow: 0 -4px 12px rgba(0,0,0,.15);
    }

    /* Hilangkan padding header agar rapih */
    #shareModal .modal-header {
        padding-bottom: 0;
    }
}
/* MOBILE ONLY */
@media (max-width: 767px) {
    .modal.bottom-sheet .modal-dialog .modal-content {
        border-top-left-radius: 1rem !important;
        border-top-right-radius: 1rem !important;
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }
}

@media (min-width: 768px) {
    .modal.bottom-sheet .modal-content {
        border-radius: 1rem; /* semua sudut rounded */
    }
}

			/* Share Options Horizontal */
			.share-options {
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap;
			gap: 1rem;
			padding-top: 0.5rem;
			}
			
			.share-option {
			display: flex;
			flex-direction: column;
			align-items: center;
			text-decoration: none;
			color: inherit;
			width: 70px;
			transition: transform 0.2s ease;
			}
			
			.share-option:hover {
			transform: translateY(-5px);
			}
			
			.share-option i {
			font-size: 1.8rem;
			}
			
			.share-option span {
			margin-top: 5px;
			font-size: 0.85rem;
			}	

			.star {
              display: inline-block;
              color: #ffbf00; /* warna bintang kosong */
              position: relative;
              font-size: 1em; /* bisa kamu sesuaikan */
              padding: 0;
              margin: 0;
            }
            .star.full {
              color: #ffc107; /* warna bintang penuh (Bootstrap warning color) */
            }
            .star.half::before {
              content: "★";
              color: #ffc107;
              position: absolute;
              width: 50%; /* setengah bintang */
              overflow: hidden;
              top: 0;
              left: 0;
            }

			#chatBody {
			max-height: 300px;
			overflow-y: auto;
			}
			/* modal warning */
			.modal-overlay {
			position: fixed; inset: 0;
			background: rgba(0,0,0,0.4);
			display: flex; align-items: center; justify-content: center;
			z-index: 2000;
			}
			.modal-box {
			background: #fff; padding: 1.5rem; border-radius: 10px;
			box-shadow: 0 4px 15px rgba(0,0,0,0.2);
			max-width: 320px; text-align: center;
			animation: fadeIn .2s ease;
			}
			.modal-box h3 { margin: 0 0 10px; font-size: 1.2rem; }
			.modal-actions { margin-top: 1rem; display: flex; justify-content: space-between; gap: 10px; }
			.modal-actions button {
			flex: 1; padding: 8px 12px; border: none; border-radius: 6px;
			cursor: pointer; font-weight: 600;
			}
			#cancelBtn { background: #eee; }
			#confirmBtn { background: #007bff; color: white; }
			
			@keyframes fadeIn {
			from { opacity:0; transform: scale(0.95); }
			to { opacity:1; transform: scale(1); }
			}
            
		    /*--- footer ----*/
			#footer .collapse a {
			color: #000;
			}
			#footer .brand a {
			font-size: 30px;
			color: #000;
			margin: auto;
			}
			#footer .bottoms {
			margin: 20px 0;
			padding-top: 10px;
			}
			footer a {
			text-decoration: none !important;
			color: #fff;
			}
			
			footer a:hover {
			color: #0dcaf0; /* contoh warna Bootstrap cyan */
			}
			
			#footer .btn i {
			position: relative;
			left: 2px;
			display: inline-block;
			padding: 6px 6px;
			border-radius: 3px 0 0 3px;
			}
			#footer .shfooter .collapse {
			display: inherit;
			}
			#footer .shfooter ul li {
			margin: 5px 0;
			}
			#footer .shfooter ul li a {
			color: #000 !important;
			}
			@media (max-width: 767px) {
			#footer .shfooter .title {
			border-bottom: 1px solid #ccc;
			}
			#footer .shfooter ul {
			margin-bottom: 0;
			}
			#footer .shfooter ul li a {
			color: #000 !important;
			}
			#footer .shfooter .collapse {
			display: none;
			}
			
			#footer .shfooter .collapse.show {
			display: block;
			}
			
			#footer .fa-chevron-up {
			transition: all 0.3s ease;
			}
			#footer .title[aria-expanded="true"] .fa-chevron-down {
			transform: rotate(180deg);
			}
			#footer .title .collapsed .fa-chevron-up {
			transform: rotate(180deg);
			}
			#footer .title i {
			float: right;
			}
			#footer .cta {
			margin: 20px 0;
			}
			}
			
			#footer-logo {
			font-size: 30px;
			font-weight: 600;
			}
			#footer .title i {
			position: relative;
			top: 5px;
			}
			#footer .social {
			position: relative;
			top: 15px;
			}
			
		    /*--- halaman jasa-cctv ----*/
			:root {
			--primary: #0d6efd;
			/* Biru Bootstrap */
			--secondary: #6c757d;
			--dark: #212529;
			}
			.toc {
			background-color: #f8f9fa;
			border-radius: 10px;
			padding: 25px;
			margin: 30px 0;
			box-shadow: 0 4px 6px rgba(0,0,0,0.1);
			}
			
			.section-content {
			padding: 20px 0;
			}
			
			.nav-pills .nav-link.active {
			background-color: #0d6efd;
			}
			
			.contact-card {
			background-color: #0d6efd;
			color: white;
			border-radius: 15px;
			padding: 30px;
			margin-top: 30px;
			}
			
			.feature-list li {
			margin-bottom: 10px;
			}
			
			.feature-list i {
			color: #0d6efd;
			margin-right: 10px;
			}
			
			/* Fix untuk navbar dan sidebar */
			.navbar {
			z-index: 1030; /* Pastikan navbar di atas konten lain */
			}
			
			.sticky-sidebar {
			position: sticky;
			top: 100px; /* Sesuaikan dengan tinggi navbar */
			z-index: 1020; /* Lebih rendah dari navbar (1030) */
			height: fit-content;
			max-height: calc(100vh - 120px);
			overflow-y: auto;
			}
			
			/* Padding untuk anchor link agar tidak tertutup navbar */
			section:target::before {
			content: '';
			display: block;
			height: 80px;
			margin: -80px 0 0;
			}
			
			@media (max-width: 991.98px) {
			.sticky-sidebar {
			position: relative;
			top: 0;
			}
			}
			.testimonial-card {
			background-color: #f8f9fa;
			border-left: 4px solid var(--primary);
			}
			
            .whatsapp-float {
			position: fixed;
			bottom: 20px;
			right: 20px;
			z-index: 1000;
            }
            
            .whatsapp-float a {
			display: flex;
			align-items: center;
			background-color: #25d366;
			color: #fff;
			padding: 10px 15px;
			border-radius: 50px;
			font-size: 1rem;
			font-weight: 500;
			text-decoration: none;
			box-shadow: 0 4px 6px rgba(0,0,0,0.3);
			transition: all 0.2s ease-in-out;
            }
            
            .whatsapp-float a:hover {
			background-color: #20b955;
			transform: translateY(-2px);
			box-shadow: 0 6px 12px rgba(0,0,0,0.3);
			color: #fff;
            }
            
            .whatsapp-float i {
			font-size: 1.5rem;
			margin-right: 8px;
            }