inviteable – Undangan Digital yang Bikin Tamu Kamu Wow<\/title>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link\n href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\"\n rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\n <style>\n * {\n margin: 0 !important;\n padding: 0 !important;\n box-sizing: border-box !important;\n }\n\n :root {\n --dc-lp-primary: #2d2b2a !important;\n --dc-lp-accent: #c5a880 !important;\n --dc-lp-text-primary: #1a1a1a !important;\n --dc-lp-text-secondary: #666666 !important;\n --dc-lp-bg-primary: #ffffff !important;\n --dc-lp-bg-secondary: #faf9f7 !important;\n --dc-lp-border: #ebe9e4 !important;\n --dc-lp-shadow-sm: 0 4px 15px rgba(0, 0, 0, 0.03) !important;\n --dc-lp-shadow-md: 0 10px 30px rgba(0, 0, 0, 0.05) !important;\n --dc-lp-shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.08) !important;\n --dc-lp-transition: all 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) !important;\n --font-heading: 'Playfair Display', serif !important;\n }\n\n html {\n font-size: 14px !important;\n }\n\n h1,\n h2,\n h3,\n .dc-lp-logo {\n font-family: var(--font-heading) !important;\n }\n\n .dc-lp-wrapper {\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;\n background: var(--dc-lp-bg-primary) !important;\n color: var(--dc-lp-text-primary) !important;\n line-height: 1.6 !important;\n -webkit-font-smoothing: antialiased !important;\n padding-top: 42px !important;\n }\n\n \/* Hero Section *\/\n .dc-lp-hero {\n position: relative !important;\n height: 100dvh !important;\n min-height: 600px !important;\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n justify-content: center !important;\n text-align: center !important;\n padding: 2rem 1.5rem !important;\n overflow: hidden !important;\n }\n\n \/* Hero Background Image *\/\n .dc-lp-hero-bg {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background-image: url('https:\/\/inviteable.id\/shop\/wp-content\/uploads\/2025\/12\/597323560_852537600843545_5374265213497644563_n.webp') !important;\n background-size: cover !important;\n background-position: center !important;\n background-repeat: no-repeat !important;\n z-index: 1 !important;\n }\n\n \/* Black Overlay with Shimmering Effect *\/\n .dc-lp-hero-overlay {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.6)) !important;\n z-index: 2 !important;\n overflow: hidden !important;\n }\n\n .dc-lp-hero-overlay::before {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg,\n transparent 0%,\n rgba(255, 255, 255, 0.4) 50%,\n transparent 100%);\n animation: dc-lp-shimmer 3s ease-in-out infinite;\n }\n\n @keyframes dc-lp-shimmer {\n 0% {\n left: -100%;\n }\n\n 100% {\n left: 100%;\n }\n }\n\n \/* Hero Content *\/\n .dc-lp-hero-content {\n position: relative !important;\n z-index: 3 !important;\n max-width: 900px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-logo {\n font-size: 1.2rem !important;\n font-weight: 300 !important;\n color: white !important;\n letter-spacing: 5px !important;\n margin-bottom: 0.5rem !important;\n text-transform: uppercase !important;\n font-family: 'Inter', sans-serif !important;\n }\n\n .dc-lp-tagline {\n font-size: 0.75rem !important;\n color: var(--dc-lp-accent) !important;\n font-style: italic !important;\n font-family: var(--font-heading) !important;\n margin-bottom: 2rem !important;\n letter-spacing: 1.5px !important;\n text-transform: lowercase !important;\n }\n\n .dc-lp-hero-headline {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n color: white !important;\n line-height: 1.2 !important;\n margin-bottom: 1rem !important;\n max-width: 800px !important;\n margin-left: auto !important;\n margin-right: auto !important;\n }\n\n .dc-lp-hero-headline em {\n font-family: var(--font-heading) !important;\n font-style: italic !important;\n color: var(--dc-lp-accent) !important;\n }\n\n .dc-lp-hero-subheadline {\n font-size: 1.05rem !important;\n font-weight: 300 !important;\n color: rgba(255, 255, 255, 0.85) !important;\n line-height: 1.6 !important;\n letter-spacing: 0.5px !important;\n margin-bottom: 2rem !important;\n max-width: 700px !important;\n margin-left: auto !important;\n margin-right: auto !important;\n }\n\n .dc-lp-hero-cta {\n display: inline-flex !important;\n align-items: center !important;\n gap: 0.75rem !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n padding: 1rem 2.5rem !important;\n border-radius: 2px !important;\n font-size: 1.1rem !important;\n font-weight: 600 !important;\n text-decoration: none !important;\n transition: var(--dc-lp-transition) !important;\n box-shadow: none !important;\n border: 1px solid var(--dc-lp-primary) !important;\n cursor: pointer !important;\n }\n\n .dc-lp-hero-cta:hover {\n background: #1a1a1a !important;\n transform: translateY(-2px) !important;\n box-shadow: var(--dc-lp-shadow-lg) !important;\n }\n\n .dc-lp-hero-stats {\n display: flex !important;\n justify-content: center !important;\n gap: 2rem !important;\n margin-top: 2rem !important;\n flex-wrap: wrap !important;\n }\n\n .dc-lp-stat-item {\n display: flex !important;\n align-items: center !important;\n gap: 0.5rem !important;\n font-size: 0.7rem !important;\n color: rgba(255, 255, 255, 0.95) !important;\n }\n\n .dc-lp-stat-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 1rem !important;\n filter: brightness(1.2) !important;\n }\n\n \/* Sale Banner *\/\n .dc-lp-sale-banner {\n background: var(--dc-lp-primary) !important;\n color: white !important;\n text-align: center !important;\n padding: 0.75rem 1.5rem !important;\n font-size: 0.85rem !important;\n font-weight: 600 !important;\n letter-spacing: 0.5px !important;\n text-transform: uppercase !important;\n position: fixed !important;\n top: 0 !important;\n left: 0 !important;\n right: 0 !important;\n z-index: 1000 !important;\n overflow: hidden !important;\n }\n\n .dc-lp-sale-banner::before {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg,\n transparent 0%,\n rgba(255, 255, 255, 0.4) 50%,\n transparent 100%);\n animation: dc-lp-shimmer 3s ease-in-out infinite;\n }\n\n @keyframes dc-lp-shimmer {\n 0% {\n left: -100%;\n }\n\n 100% {\n left: 100%;\n }\n }\n\n .dc-lp-sale-text {\n position: relative !important;\n z-index: 1 !important;\n }\n\n \/* Value Props Section *\/\n .dc-lp-value-props {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-section-title {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n font-style: italic !important;\n color: var(--dc-lp-text-primary) !important;\n text-align: center !important;\n margin-bottom: 2.5rem !important;\n }\n\n .dc-lp-props-grid {\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 1.5rem !important;\n max-width: 1200px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-prop-card {\n background: var(--dc-lp-bg-secondary) !important;\n padding: 1.5rem !important;\n border-radius: 2px !important;\n border: 1px solid var(--dc-lp-border) !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-prop-card:hover {\n border-color: var(--dc-lp-primary) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n transform: translateY(-2px) !important;\n }\n\n .dc-lp-prop-icon {\n font-size: 1.8rem !important;\n color: var(--dc-lp-accent) !important;\n margin-bottom: 1rem !important;\n }\n\n .dc-lp-prop-title {\n font-size: 1.25rem !important;\n font-weight: 500 !important;\n font-family: var(--font-heading) !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.5rem !important;\n }\n\n .dc-lp-prop-desc {\n font-size: 0.95rem !important;\n color: var(--dc-lp-text-secondary) !important;\n line-height: 1.6 !important;\n }\n\n \/* Features Section *\/\n .dc-lp-features {\n padding: 2rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n border-bottom: 1px solid var(--dc-lp-border) !important;\n }\n\n .dc-lp-features-title {\n font-size: 1.1rem !important;\n font-weight: 500 !important;\n letter-spacing: 2px !important;\n color: var(--dc-lp-text-secondary) !important;\n margin-bottom: 1.5rem !important;\n text-transform: uppercase !important;\n text-align: center !important;\n }\n\n .dc-lp-features-grid {\n display: grid !important;\n grid-template-columns: repeat(2, 1fr) !important;\n gap: 1rem !important;\n max-width: 1000px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-feature-item {\n display: flex !important;\n align-items: center !important;\n gap: 0.65rem !important;\n font-size: 0.9rem !important;\n color: var(--dc-lp-text-primary) !important;\n }\n\n .dc-lp-feature-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 0.9rem !important;\n flex-shrink: 0 !important;\n }\n\n \/* Product Catalog *\/\n .dc-lp-catalog {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-catalog-header {\n text-align: center !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-catalog-title {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n font-style: italic !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.75rem !important;\n }\n\n .dc-lp-catalog-subtitle {\n font-size: 1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n }\n\n \/* Categories *\/\n .dc-lp-categories {\n display: flex !important;\n gap: 0.75rem !important;\n justify-content: center !important;\n flex-wrap: wrap !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-category-btn {\n padding: 0.75rem 1.5rem !important;\n border: 1px solid var(--dc-lp-border) !important;\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 500 !important;\n color: var(--dc-lp-text-secondary) !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n }\n\n .dc-lp-category-btn.dc-lp-active {\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border-color: var(--dc-lp-primary) !important;\n }\n\n .dc-lp-category-btn:hover:not(.dc-lp-active) {\n border-color: var(--dc-lp-primary) !important;\n color: var(--dc-lp-primary) !important;\n }\n\n \/* Product Grid *\/\n .dc-lp-product-grid {\n display: grid !important;\n grid-template-columns: repeat(2, 1fr) !important;\n gap: 1.25rem !important;\n max-width: 1200px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-product-card {\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 2px !important;\n overflow: hidden !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n transition: var(--dc-lp-transition) !important;\n border: 1px solid var(--dc-lp-border) !important;\n }\n\n .dc-lp-product-card:hover {\n box-shadow: var(--dc-lp-shadow-md) !important;\n transform: translateY(-2px) !important;\n }\n\n .dc-lp-product-image-wrapper {\n position: relative !important;\n width: 100% !important;\n padding-top: 177.77% !important;\n background: linear-gradient(135deg, #f5f3f0 0%, #e8e5e0 100%) !important;\n overflow: hidden !important;\n }\n\n .dc-lp-product-image {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n object-fit: cover !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-product-card:hover .dc-lp-product-image {\n transform: scale(1.05) !important;\n }\n\n .dc-lp-product-labels {\n position: absolute !important;\n top: 0.75rem !important;\n left: 0.75rem !important;\n display: flex !important;\n flex-direction: column !important;\n gap: 0.5rem !important;\n align-items: flex-start !important;\n }\n\n .dc-lp-product-label {\n background: rgba(255, 255, 255, 0.95) !important;\n backdrop-filter: blur(10px) !important;\n color: var(--dc-lp-text-primary) !important;\n font-size: 0.55rem !important;\n font-weight: 600 !important;\n padding: 0.35rem 0.65rem !important;\n border-radius: 4px !important;\n text-transform: uppercase !important;\n letter-spacing: 0.5px !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n }\n\n .dc-lp-discount-badge {\n position: absolute !important;\n top: 0.75rem !important;\n right: 0.75rem !important;\n background: #dc2626 !important;\n color: white !important;\n font-size: 0.75rem !important;\n font-weight: 700 !important;\n padding: 0.35rem 0.65rem !important;\n border-radius: 4px !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n }\n\n .dc-lp-product-info {\n padding: 1rem !important;\n }\n\n .dc-lp-product-name {\n font-size: 1.05rem !important;\n font-weight: 600 !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.65rem !important;\n line-height: 1.3 !important;\n }\n\n .dc-lp-product-price-wrapper {\n display: none;\n align-items: center !important;\n gap: 0.65rem !important;\n margin-bottom: 0.85rem !important;\n }\n\n .dc-lp-product-price {\n font-size: 1.1rem !important;\n font-weight: 700 !important;\n color: var(--dc-lp-primary) !important;\n }\n\n .dc-lp-product-price-old {\n font-size: 0.85rem !important;\n color: var(--dc-lp-text-secondary) !important;\n text-decoration: line-through !important;\n }\n\n .dc-lp-preview-btn {\n width: 100% !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border: none !important;\n padding: 0.75rem 1.5rem !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 500 !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n gap: 0.5rem !important;\n }\n\n .dc-lp-preview-btn:hover {\n background: #1a1a1a !important;\n transform: translateY(-1px) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n }\n\n \/* Social Proof *\/\n .dc-lp-social-proof {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n }\n\n .dc-lp-testimonials {\n max-width: 1000px !important;\n margin: 0 auto !important;\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 1.5rem !important;\n }\n\n .dc-lp-testimonial-card {\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 4px !important;\n border: 1px solid var(--dc-lp-border) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n overflow: hidden !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-testimonial-card:hover {\n box-shadow: var(--dc-lp-shadow-lg) !important;\n transform: translateY(-4px) !important;\n }\n\n .dc-lp-testimonial-image {\n width: 100% !important;\n height: auto !important;\n display: block !important;\n object-fit: cover !important;\n }\n\n \/* How It Works *\/\n .dc-lp-how-it-works {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-steps {\n max-width: 900px !important;\n margin: 0 auto !important;\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 2rem !important;\n }\n\n .dc-lp-step {\n display: flex !important;\n gap: 1.5rem !important;\n align-items: flex-start !important;\n }\n\n .dc-lp-step-number {\n flex-shrink: 0 !important;\n width: 3rem !important;\n height: 3rem !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n font-size: 1.3rem !important;\n font-weight: 700 !important;\n }\n\n .dc-lp-step-content h3 {\n font-size: 1.25rem !important;\n font-weight: 500 !important;\n font-family: var(--font-heading) !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.5rem !important;\n }\n\n .dc-lp-step-content p {\n font-size: 0.95rem !important;\n color: var(--dc-lp-text-secondary) !important;\n line-height: 1.6 !important;\n }\n\n \/* Final CTA *\/\n .dc-lp-final-cta {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n text-align: center !important;\n }\n\n .dc-lp-final-cta-title {\n font-size: 3.5rem !important;\n font-weight: 400 !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 1rem !important;\n }\n\n .dc-lp-final-cta-text {\n font-size: 1.1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-urgency-text {\n display: inline-block !important;\n background: #fef3c7 !important;\n color: #92400e !important;\n padding: 0.5rem 1rem !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 600 !important;\n margin-bottom: 2rem !important;\n }\n\n \/* Booking Popup Modal *\/\n .dc-lp-popup-overlay {\n position: fixed !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background: rgba(0, 0, 0, 0.7) !important;\n backdrop-filter: blur(5px) !important;\n z-index: 2000 !important;\n display: none !important;\n align-items: center !important;\n justify-content: center !important;\n padding: 1.5rem !important;\n animation: dc-lp-fadeIn 0.3s ease-out !important;\n }\n\n .dc-lp-popup-overlay.dc-lp-show {\n display: flex !important;\n }\n\n .dc-lp-popup-modal {\n background: white !important;\n border-radius: 4px !important;\n max-width: 500px !important;\n width: 100% !important;\n padding: 2rem !important;\n position: relative !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n animation: dc-lp-slideUp 0.4s ease-out !important;\n }\n\n @keyframes dc-lp-slideUp {\n from {\n opacity: 0 !important;\n transform: translateY(30px) !important;\n }\n\n to {\n opacity: 1 !important;\n transform: translateY(0) !important;\n }\n }\n\n .dc-lp-popup-close {\n position: absolute !important;\n top: 1rem !important;\n right: 1rem !important;\n background: transparent !important;\n border: none !important;\n font-size: 1.5rem !important;\n color: #666 !important;\n cursor: pointer !important;\n width: 32px !important;\n height: 32px !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-radius: 50% !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-popup-close:hover {\n background: #f3f4f6 !important;\n color: #333 !important;\n }\n\n .dc-lp-popup-icon {\n width: 60px !important;\n height: 60px !important;\n background: var(--dc-lp-primary) !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n margin: 0 auto 1.5rem !important;\n font-size: 2rem !important;\n color: white !important;\n }\n\n .dc-lp-popup-title {\n font-size: 1.5rem !important;\n font-weight: 700 !important;\n color: var(--dc-lp-text-primary) !important;\n text-align: center !important;\n margin-bottom: 0.75rem !important;\n line-height: 1.3 !important;\n }\n\n .dc-lp-popup-subtitle {\n font-size: 1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n text-align: center !important;\n margin-bottom: 1.5rem !important;\n line-height: 1.6 !important;\n }\n\n .dc-lp-popup-features {\n background: #f9fafb !important;\n border-radius: 2px !important;\n padding: 1.25rem !important;\n margin-bottom: 1.5rem !important;\n }\n\n .dc-lp-popup-feature {\n display: flex !important;\n align-items: flex-start !important;\n gap: 0.75rem !important;\n margin-bottom: 0.75rem !important;\n }\n\n .dc-lp-popup-feature:last-child {\n margin-bottom: 0 !important;\n }\n\n .dc-lp-popup-feature-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 1.1rem !important;\n flex-shrink: 0 !important;\n margin-top: 0.1rem !important;\n }\n\n .dc-lp-popup-feature-text {\n font-size: 0.9rem !important;\n color: var(--dc-lp-text-primary) !important;\n line-height: 1.5 !important;\n }\n\n .dc-lp-popup-urgency {\n background: #fef3c7 !important;\n border-left: 4px solid #f59e0b !important;\n padding: 0.75rem 1rem !important;\n border-radius: 2px !important;\n margin-bottom: 1.5rem !important;\n display: flex !important;\n align-items: center !important;\n gap: 0.75rem !important;\n }\n\n .dc-lp-popup-urgency-icon {\n color: #f59e0b !important;\n font-size: 1.2rem !important;\n flex-shrink: 0 !important;\n }\n\n .dc-lp-popup-urgency-text {\n font-size: 0.85rem !important;\n color: #92400e !important;\n font-weight: 600 !important;\n line-height: 1.4 !important;\n }\n\n .dc-lp-popup-cta {\n width: 100% !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border: none !important;\n padding: 1rem 2rem !important;\n border-radius: 2px !important;\n font-size: 1rem !important;\n font-weight: 600 !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n gap: 0.5rem !important;\n text-decoration: none !important;\n }\n\n .dc-lp-popup-cta:hover {\n transform: translateY(-2px) !important;\n box-shadow: 0 8px 20px rgba(139, 115, 85, 0.3) !important;\n }\n\n \/* WhatsApp Floating Button *\/\n .dc-lp-wa-float {\n position: fixed !important;\n bottom: 2rem !important;\n right: 2rem !important;\n background: #25d366 !important;\n color: white !important;\n width: 50px !important;\n height: 50px !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n font-size: 1.8rem !important;\n box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4) !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n z-index: 1000 !important;\n text-decoration: none !important;\n }\n\n .dc-lp-wa-float:hover {\n transform: scale(1.1) !important;\n box-shadow: 0 6px 25px rgba(37, 211, 102, 0.5) !important;\n }\n\n \/* Responsive *\/\n @media (min-width: 640px) {\n .dc-lp-props-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-product-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-features-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-testimonials {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-steps {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n }\n\n @media (min-width: 1024px) {\n .dc-lp-hero {\n padding: 3rem 2rem !important;\n }\n\n .dc-lp-hero-headline {\n font-size: 4rem !important;\n }\n\n .dc-lp-props-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-product-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n gap: 1.5rem !important;\n }\n\n .dc-lp-features-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-steps {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-value-props,\n .dc-lp-catalog,\n .dc-lp-social-proof,\n .dc-lp-how-it-works,\n .dc-lp-final-cta {\n padding: 4rem 2rem !important;\n }\n }\n\n @keyframes dc-lp-fadeIn {\n from {\n opacity: 0 !important;\n transform: translateY(10px) !important;\n }\n\n to {\n opacity: 1 !important;\n transform: translateY(0) !important;\n }\n }\n\n .dc-lp-product-card {\n animation: dc-lp-fadeIn 0.4s ease-out !important;\n }\n <\/style>\n<\/head>\n\n\n<div class=\"dc-lp-wrapper\">\n\n \n <section class=\"dc-lp-hero\">\n \n <div class=\"dc-lp-hero-bg\"><\/div>\n\n \n <div class=\"dc-lp-hero-overlay\"><\/div>\n\n \n <div class=\"dc-lp-hero-content\">\n <div class=\"dc-lp-logo\">inviteable<\/div>\n <div class=\"dc-lp-tagline\">a memorable invitation<\/div>\n\n <h1 class=\"dc-lp-hero-headline\">Bukan sekadar link \u2014 tapi <br><em>cerita cinta<\/em> yang hidup.\n <\/h1>\n <p class=\"dc-lp-hero-subheadline\">Teknologi Motion 3D, desain eksklusif, dan detail yang bikin beda.\n Dipercaya\n puluhan-ribu pasangan untuk momen yang cuma sekali seumur hidup.<\/p>\n\n <a href=\"#dc-lp-catalog-section\" class=\"dc-lp-hero-cta\">\n <i class=\"fas fa-sparkles\"><\/i>\n <span>Pilih Tema Favoritmu<\/span>\n <\/a>\n\n <div class=\"dc-lp-hero-stats\">\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-check-circle dc-lp-stat-icon\"><\/i>\n <span>Easy, Convenient<\/span>\n <\/div>\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-bolt dc-lp-stat-icon\"><\/i>\n <span>Team support<\/span>\n <\/div>\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-infinity dc-lp-stat-icon\"><\/i>\n <span>Unlimited Tamu<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <div class=\"dc-lp-sale-banner\">\n <span class=\"dc-lp-sale-text\">A LOVE CELEBRATION<\/span>\n <\/div>\n\n \n <section class=\"dc-lp-value-props\">\n <h2 class=\"dc-lp-section-title\">Kenapa Harus Pilih Kami?<\/h2>\n <div class=\"dc-lp-props-grid\">\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-paint-brush\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Desain yang Bikin Beda<\/h3>\n <p class=\"dc-lp-prop-desc\">Tamu kamu bakal mikir kamu hire wedding planner mahal. Padahal cuma mulai\n dari 100rb!<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-bolt\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Team Support<\/h3>\n <p class=\"dc-lp-prop-desc\">Ditemani hingga hari H. Kami siap membantu jika ada kendala.<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-gem\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Unlimited Tamu<\/h3>\n <p class=\"dc-lp-prop-desc\">Nggak ada yang ketinggalan di hari spesial kamu. Undang sebanyak yang kamu\n mau, tanpa batas.<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-leaf\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Ramah Lingkungan<\/h3>\n <p class=\"dc-lp-prop-desc\">Pilihan cerdas generasi kamu. Hemat kertas, hemat biaya, tetap elegan.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-features\">\n <h2 class=\"dc-lp-features-title\">Semua yang Kamu Butuhin, Udah Lengkap<\/h2>\n <div class=\"dc-lp-features-grid\">\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Nama Tamu Unlimited<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>20 Foto + 2 Mempelai<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Countdown Timer<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Info Rekening<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Maps Navigation<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>RSVP Kehadiran<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Custom Music<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Kisah Cinta<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Ucapan & Doa<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Video Prewed<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Live Wedding<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Share ke Sosmed<\/span>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-catalog\" id=\"dc-lp-catalog-section\">\n <div class=\"dc-lp-catalog-header\">\n <h2 class=\"dc-lp-catalog-title\">Pilih Tema yang Cocok Sama Vibe Kamu<\/h2>\n <p class=\"dc-lp-catalog-subtitle\">35+ tema eksklusif dengan berbagai style. Pilih yang paling cocok sama\n kamu!<\/p>\n <\/div>\n\n \n <div class=\"dc-lp-categories\">\n <button class=\"dc-lp-category-btn dc-lp-active\" data-label=\"Semua\">Semua<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"Motion 3D\">Motion 3D<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"New Design\">New Design<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"Nophoto\">Nophoto<\/button>\n <\/div>\n\n \n <div class=\"dc-lp-product-grid\" id=\"dc-lp-productGrid\">\n \n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-social-proof\">\n <h2 class=\"dc-lp-section-title\">Kata Mereka yang Udah Pakai<\/h2>\n <div class=\"dc-lp-testimonials\">\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194408.png\"\n alt=\"Instagram Comment Screenshot 1\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194343.png\"\n alt=\"Instagram Comment Screenshot 2\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194325.png\"\n alt=\"Instagram Comment Screenshot 3\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-how-it-works\">\n <h2 class=\"dc-lp-section-title\">Gampang Banget, Cuma 4 Langkah!<\/h2>\n <div class=\"dc-lp-steps\">\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">1<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Pilih Tema<\/h3>\n <p>Browse katalog kami dan pilih tema yang paling cocok sama vibe acara kamu.<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">2<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Isi Data<\/h3>\n <p>Kirim data acara, foto, dan musik pilihan kamu via WhatsApp. Gampang!<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">3<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Review & Revisi<\/h3>\n <p>Kami kirim preview ke kamu. Proses revisi. Done!<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">4<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Siap Dibagikan!<\/h3>\n <p>Undangan kamu siap! Langsung share ke tamu lewat WhatsApp atau sosmed.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-final-cta\">\n <h2 class=\"dc-lp-final-cta-title\">Siap Bikin Undangan yang Unforgettable?<\/h2>\n <p class=\"dc-lp-final-cta-text\">Join puluhan ribu pasangan yang udah bikin momen spesial mereka makin berkesan\n <\/p>\n <div class=\"dc-lp-urgency-text\">\n <i class=\"fas fa-fire\"><\/i> Slot terbatas. Jangan tunda lagi!\n <\/div>\n <a href=\"#dc-lp-catalog-section\" class=\"dc-lp-hero-cta\">\n <i class=\"fas fa-rocket\"><\/i>\n <span>Mulai Sekarang<\/span>\n <\/a>\n <\/section>\n\n \n\n \n <div class=\"dc-lp-popup-overlay\" id=\"dcLpBookingPopup\">\n <div class=\"dc-lp-popup-modal\">\n <button class=\"dc-lp-popup-close\" id=\"dcLpClosePopup\">\n <i class=\"fas fa-times\"><\/i>\n <\/button>\n\n <div class=\"dc-lp-popup-icon\">\n <i class=\"fas fa-calendar-check\"><\/i>\n <\/div>\n\n <h3 class=\"dc-lp-popup-title\">Slot Terbatas! Booking Dulu Aja<\/h3>\n <p class=\"dc-lp-popup-subtitle\">Nggak perlu ribet! Data dan foto bisa menyusul nanti. Yang penting slot kamu\n aman dulu.<\/p>\n\n <div class=\"dc-lp-popup-features\">\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Booking sekarang<\/strong>, data dan foto kirim\n belakangan<\/span>\n <\/div>\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Slot terjamin<\/strong>, nggak khawatir\n kehabisan<\/span>\n <\/div>\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Hati tenang<\/strong>, Gak was-was dan terus kepikiran\n soal undangan<\/span>\n <\/div>\n <\/div>\n\n <div class=\"dc-lp-popup-urgency\">\n <i class=\"fas fa-fire dc-lp-popup-urgency-icon\"><\/i>\n <span class=\"dc-lp-popup-urgency-text\">Demi menjaga kualitas, jumlah undangan dibatasi tiap bulan-nya.\n Udah, jangan ditunda lagi!<\/span>\n <\/div>\n\n <a href=\"https:\/\/inviteable.id\/shop\/atc-1\/\" class=\"dc-lp-popup-cta\" target=\"_blank\">\n <i class=\"fab fa-whatsapp\"><\/i>\n <span>Booking Sekarang via WhatsApp<\/span>\n <\/a>\n <\/div>\n <\/div>\n\n<\/div>\n\n<script>\n \/\/ Data produk di-load dari file JSON terpisah agar mudah di-manage\n let dcLpProducts = [];\n\n \/\/ Calculate discount percentage\n function dcLpCalculateDiscount(oldPrice, newPrice) {\n const discount = ((oldPrice - newPrice) \/ oldPrice) * 100;\n return `-${Math.round(discount)}%`;\n }\n\n \/\/ Format currency\n function dcLpFormatCurrency(amount) {\n return new Intl.NumberFormat('id-ID', {\n style: 'currency',\n currency: 'IDR',\n minimumFractionDigits: 0\n }).format(amount);\n }\n\n \/\/ Render products\n function dcLpRenderProducts(productsToRender) {\n const productGrid = document.getElementById('dc-lp-productGrid');\n productGrid.innerHTML = productsToRender.map(product => `\n <div class=\"dc-lp-product-card\" data-id=\"${product.id}\">\n <div class=\"dc-lp-product-image-wrapper\">\n <img decoding=\"async\" src=\"${product.image}\" alt=\"${product.name}\" class=\"dc-lp-product-image\" style=\"object-fit:cover;object-position:top;\" loading=\"lazy\">\n <div class=\"dc-lp-product-labels\">\n ${product.labels.map(label => `<span class=\"dc-lp-product-label\">${label}<\/span>`).join('')}\n <\/div>\n <span class=\"dc-lp-discount-badge\">${dcLpCalculateDiscount(product.oldPrice, product.price)}<\/span>\n <\/div>\n <div class=\"dc-lp-product-info\">\n <h3 class=\"dc-lp-product-name\">${product.name}<\/h3>\n <div class=\"dc-lp-product-price-wrapper\">\n <span class=\"dc-lp-product-price-old\">${dcLpFormatCurrency(product.oldPrice)}<\/span>\n <span class=\"dc-lp-product-price\">${dcLpFormatCurrency(product.price)}<\/span>\n <\/div>\n <button class=\"dc-lp-preview-btn\" data-id=\"${product.id}\">\n <i class=\"fas fa-eye\"><\/i>\n <span>Preview<\/span>\n <\/button>\n <\/div>\n <\/div>\n `).join('');\n\n \/\/ Add event listeners for preview buttons\n document.querySelectorAll('.dc-lp-preview-btn').forEach(btn => {\n btn.addEventListener('click', (e) => {\n e.stopPropagation();\n const productId = parseInt(btn.dataset.id);\n const product = dcLpProducts.find(p => p.id === productId);\n if (product && product.previewLink) {\n window.open(product.previewLink, '_blank');\n }\n });\n });\n }\n\n \/\/ Fetch data dari file JSON lalu init semua fitur\n async function dcLpInitApp() {\n try {\n const response = await fetch('https:\/\/inviteable.id\/shop\/json\/data.json');\n dcLpProducts = await response.json();\n } catch (error) {\n console.warn('Remote fetch gagal, coba lokal...', error);\n try {\n const localResponse = await fetch('json\/data.json');\n dcLpProducts = await localResponse.json();\n } catch (localError) {\n console.error('Gagal memuat data produk:', localError);\n return;\n }\n }\n\n \/\/ Label filter\n document.querySelectorAll('.dc-lp-category-btn').forEach(btn => {\n btn.addEventListener('click', () => {\n document.querySelectorAll('.dc-lp-category-btn').forEach(b => b.classList.remove('dc-lp-active'));\n btn.classList.add('dc-lp-active');\n const label = btn.dataset.label;\n const filtered = label === 'Semua'\n ? dcLpProducts\n : dcLpProducts.filter(p => p.labels.includes(label));\n dcLpRenderProducts(filtered);\n });\n });\n\n \/\/ Smooth scroll for anchor links\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n const target = document.querySelector(this.getAttribute('href'));\n if (target) {\n target.scrollIntoView({\n behavior: 'smooth',\n block: 'start'\n });\n }\n });\n });\n\n \/\/ Booking Popup - Show when catalog section enters viewport\n const bookingPopup = document.getElementById('dcLpBookingPopup');\n const closePopupBtn = document.getElementById('dcLpClosePopup');\n const catalogSection = document.getElementById('dc-lp-catalog-section');\n let popupShown = false;\n\n function showBookingPopup() {\n if (!popupShown) {\n bookingPopup.classList.add('dc-lp-show');\n document.body.style.overflow = 'hidden';\n popupShown = true;\n }\n }\n\n function closeBookingPopup() {\n bookingPopup.classList.remove('dc-lp-show');\n document.body.style.overflow = '';\n }\n\n \/\/ Close popup on button click\n closePopupBtn.addEventListener('click', closeBookingPopup);\n\n \/\/ Close popup on overlay click\n bookingPopup.addEventListener('click', function (e) {\n if (e.target === bookingPopup) {\n closeBookingPopup();\n }\n });\n\n \/\/ Detect when catalog section enters viewport\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n showBookingPopup();\n }\n });\n }, {\n threshold: 0.1,\n rootMargin: '0px'\n });\n\n if (catalogSection) {\n observer.observe(catalogSection);\n }\n\n \/\/ Initial render\n dcLpRenderProducts(dcLpProducts);\n }\n\n \/\/ Jalankan init\n dcLpInitApp();\n<\/script>\n\n<\/html>","protected":false},"excerpt":{"rendered":"<p>inviteable – Undangan Digital yang Bikin Tamu Kamu Wow inviteable a memorable invitation Bukan sekadar link \u2014 tapi cerita cinta yang hidup. Teknologi Motion 3D, desain eksklusif, dan detail yang bikin beda. Dipercaya puluhan-ribu pasangan untuk momen yang cuma sekali seumur hidup. Pilih Tema Favoritmu Easy, Convenient Team support Unlimited Tamu A LOVE CELEBRATION Kenapa …<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"slim_seo":{"title":"Undangan Digital by: Inviteable","description":"inviteable - Undangan Digital yang Bikin Tamu Kamu Wow inviteable a memorable invitation Bukan sekadar link \u2014 tapi cerita cinta yang hidup. Teknologi Motion 3D,"},"footnotes":""},"class_list":["post-4503","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/comments?post=4503"}],"version-history":[{"count":19,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503\/revisions"}],"predecessor-version":[{"id":4560,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503\/revisions\/4560"}],"wp:attachment":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/media?parent=4503"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":4503,"date":"2025-12-15T19:59:38","date_gmt":"2025-12-15T12:59:38","guid":{"rendered":"https:\/\/inviteable.id\/shop\/?page_id=4503"},"modified":"2026-03-29T08:32:11","modified_gmt":"2026-03-29T01:32:11","slug":"home-dc25","status":"publish","type":"page","link":"https:\/\/inviteable.id\/shop\/","title":{"rendered":"by Inviteable"},"content":{"rendered":"\n\n\n\n \n \n inviteable – Undangan Digital yang Bikin Tamu Kamu Wow<\/title>\n <link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\n <link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin>\n <link\n href=\"https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap\"\n rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.5.1\/css\/all.min.css\">\n <style>\n * {\n margin: 0 !important;\n padding: 0 !important;\n box-sizing: border-box !important;\n }\n\n :root {\n --dc-lp-primary: #2d2b2a !important;\n --dc-lp-accent: #c5a880 !important;\n --dc-lp-text-primary: #1a1a1a !important;\n --dc-lp-text-secondary: #666666 !important;\n --dc-lp-bg-primary: #ffffff !important;\n --dc-lp-bg-secondary: #faf9f7 !important;\n --dc-lp-border: #ebe9e4 !important;\n --dc-lp-shadow-sm: 0 4px 15px rgba(0, 0, 0, 0.03) !important;\n --dc-lp-shadow-md: 0 10px 30px rgba(0, 0, 0, 0.05) !important;\n --dc-lp-shadow-lg: 0 20px 40px rgba(0, 0, 0, 0.08) !important;\n --dc-lp-transition: all 0.5s cubic-bezier(0.2, 0.8, 0.2, 1) !important;\n --font-heading: 'Playfair Display', serif !important;\n }\n\n html {\n font-size: 14px !important;\n }\n\n h1,\n h2,\n h3,\n .dc-lp-logo {\n font-family: var(--font-heading) !important;\n }\n\n .dc-lp-wrapper {\n font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif !important;\n background: var(--dc-lp-bg-primary) !important;\n color: var(--dc-lp-text-primary) !important;\n line-height: 1.6 !important;\n -webkit-font-smoothing: antialiased !important;\n padding-top: 42px !important;\n }\n\n \/* Hero Section *\/\n .dc-lp-hero {\n position: relative !important;\n height: 100dvh !important;\n min-height: 600px !important;\n display: flex !important;\n flex-direction: column !important;\n align-items: center !important;\n justify-content: center !important;\n text-align: center !important;\n padding: 2rem 1.5rem !important;\n overflow: hidden !important;\n }\n\n \/* Hero Background Image *\/\n .dc-lp-hero-bg {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background-image: url('https:\/\/inviteable.id\/shop\/wp-content\/uploads\/2025\/12\/597323560_852537600843545_5374265213497644563_n.webp') !important;\n background-size: cover !important;\n background-position: center !important;\n background-repeat: no-repeat !important;\n z-index: 1 !important;\n }\n\n \/* Black Overlay with Shimmering Effect *\/\n .dc-lp-hero-overlay {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background: linear-gradient(to bottom, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.6)) !important;\n z-index: 2 !important;\n overflow: hidden !important;\n }\n\n .dc-lp-hero-overlay::before {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg,\n transparent 0%,\n rgba(255, 255, 255, 0.4) 50%,\n transparent 100%);\n animation: dc-lp-shimmer 3s ease-in-out infinite;\n }\n\n @keyframes dc-lp-shimmer {\n 0% {\n left: -100%;\n }\n\n 100% {\n left: 100%;\n }\n }\n\n \/* Hero Content *\/\n .dc-lp-hero-content {\n position: relative !important;\n z-index: 3 !important;\n max-width: 900px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-logo {\n font-size: 1.2rem !important;\n font-weight: 300 !important;\n color: white !important;\n letter-spacing: 5px !important;\n margin-bottom: 0.5rem !important;\n text-transform: uppercase !important;\n font-family: 'Inter', sans-serif !important;\n }\n\n .dc-lp-tagline {\n font-size: 0.75rem !important;\n color: var(--dc-lp-accent) !important;\n font-style: italic !important;\n font-family: var(--font-heading) !important;\n margin-bottom: 2rem !important;\n letter-spacing: 1.5px !important;\n text-transform: lowercase !important;\n }\n\n .dc-lp-hero-headline {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n color: white !important;\n line-height: 1.2 !important;\n margin-bottom: 1rem !important;\n max-width: 800px !important;\n margin-left: auto !important;\n margin-right: auto !important;\n }\n\n .dc-lp-hero-headline em {\n font-family: var(--font-heading) !important;\n font-style: italic !important;\n color: var(--dc-lp-accent) !important;\n }\n\n .dc-lp-hero-subheadline {\n font-size: 1.05rem !important;\n font-weight: 300 !important;\n color: rgba(255, 255, 255, 0.85) !important;\n line-height: 1.6 !important;\n letter-spacing: 0.5px !important;\n margin-bottom: 2rem !important;\n max-width: 700px !important;\n margin-left: auto !important;\n margin-right: auto !important;\n }\n\n .dc-lp-hero-cta {\n display: inline-flex !important;\n align-items: center !important;\n gap: 0.75rem !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n padding: 1rem 2.5rem !important;\n border-radius: 2px !important;\n font-size: 1.1rem !important;\n font-weight: 600 !important;\n text-decoration: none !important;\n transition: var(--dc-lp-transition) !important;\n box-shadow: none !important;\n border: 1px solid var(--dc-lp-primary) !important;\n cursor: pointer !important;\n }\n\n .dc-lp-hero-cta:hover {\n background: #1a1a1a !important;\n transform: translateY(-2px) !important;\n box-shadow: var(--dc-lp-shadow-lg) !important;\n }\n\n .dc-lp-hero-stats {\n display: flex !important;\n justify-content: center !important;\n gap: 2rem !important;\n margin-top: 2rem !important;\n flex-wrap: wrap !important;\n }\n\n .dc-lp-stat-item {\n display: flex !important;\n align-items: center !important;\n gap: 0.5rem !important;\n font-size: 0.7rem !important;\n color: rgba(255, 255, 255, 0.95) !important;\n }\n\n .dc-lp-stat-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 1rem !important;\n filter: brightness(1.2) !important;\n }\n\n \/* Sale Banner *\/\n .dc-lp-sale-banner {\n background: var(--dc-lp-primary) !important;\n color: white !important;\n text-align: center !important;\n padding: 0.75rem 1.5rem !important;\n font-size: 0.85rem !important;\n font-weight: 600 !important;\n letter-spacing: 0.5px !important;\n text-transform: uppercase !important;\n position: fixed !important;\n top: 0 !important;\n left: 0 !important;\n right: 0 !important;\n z-index: 1000 !important;\n overflow: hidden !important;\n }\n\n .dc-lp-sale-banner::before {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg,\n transparent 0%,\n rgba(255, 255, 255, 0.4) 50%,\n transparent 100%);\n animation: dc-lp-shimmer 3s ease-in-out infinite;\n }\n\n @keyframes dc-lp-shimmer {\n 0% {\n left: -100%;\n }\n\n 100% {\n left: 100%;\n }\n }\n\n .dc-lp-sale-text {\n position: relative !important;\n z-index: 1 !important;\n }\n\n \/* Value Props Section *\/\n .dc-lp-value-props {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-section-title {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n font-style: italic !important;\n color: var(--dc-lp-text-primary) !important;\n text-align: center !important;\n margin-bottom: 2.5rem !important;\n }\n\n .dc-lp-props-grid {\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 1.5rem !important;\n max-width: 1200px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-prop-card {\n background: var(--dc-lp-bg-secondary) !important;\n padding: 1.5rem !important;\n border-radius: 2px !important;\n border: 1px solid var(--dc-lp-border) !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-prop-card:hover {\n border-color: var(--dc-lp-primary) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n transform: translateY(-2px) !important;\n }\n\n .dc-lp-prop-icon {\n font-size: 1.8rem !important;\n color: var(--dc-lp-accent) !important;\n margin-bottom: 1rem !important;\n }\n\n .dc-lp-prop-title {\n font-size: 1.25rem !important;\n font-weight: 500 !important;\n font-family: var(--font-heading) !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.5rem !important;\n }\n\n .dc-lp-prop-desc {\n font-size: 0.95rem !important;\n color: var(--dc-lp-text-secondary) !important;\n line-height: 1.6 !important;\n }\n\n \/* Features Section *\/\n .dc-lp-features {\n padding: 2rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n border-bottom: 1px solid var(--dc-lp-border) !important;\n }\n\n .dc-lp-features-title {\n font-size: 1.1rem !important;\n font-weight: 500 !important;\n letter-spacing: 2px !important;\n color: var(--dc-lp-text-secondary) !important;\n margin-bottom: 1.5rem !important;\n text-transform: uppercase !important;\n text-align: center !important;\n }\n\n .dc-lp-features-grid {\n display: grid !important;\n grid-template-columns: repeat(2, 1fr) !important;\n gap: 1rem !important;\n max-width: 1000px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-feature-item {\n display: flex !important;\n align-items: center !important;\n gap: 0.65rem !important;\n font-size: 0.9rem !important;\n color: var(--dc-lp-text-primary) !important;\n }\n\n .dc-lp-feature-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 0.9rem !important;\n flex-shrink: 0 !important;\n }\n\n \/* Product Catalog *\/\n .dc-lp-catalog {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-catalog-header {\n text-align: center !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-catalog-title {\n font-size: 2.2rem !important;\n font-weight: 400 !important;\n font-style: italic !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.75rem !important;\n }\n\n .dc-lp-catalog-subtitle {\n font-size: 1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n }\n\n \/* Categories *\/\n .dc-lp-categories {\n display: flex !important;\n gap: 0.75rem !important;\n justify-content: center !important;\n flex-wrap: wrap !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-category-btn {\n padding: 0.75rem 1.5rem !important;\n border: 1px solid var(--dc-lp-border) !important;\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 500 !important;\n color: var(--dc-lp-text-secondary) !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n }\n\n .dc-lp-category-btn.dc-lp-active {\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border-color: var(--dc-lp-primary) !important;\n }\n\n .dc-lp-category-btn:hover:not(.dc-lp-active) {\n border-color: var(--dc-lp-primary) !important;\n color: var(--dc-lp-primary) !important;\n }\n\n \/* Product Grid *\/\n .dc-lp-product-grid {\n display: grid !important;\n grid-template-columns: repeat(2, 1fr) !important;\n gap: 1.25rem !important;\n max-width: 1200px !important;\n margin: 0 auto !important;\n }\n\n .dc-lp-product-card {\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 2px !important;\n overflow: hidden !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n transition: var(--dc-lp-transition) !important;\n border: 1px solid var(--dc-lp-border) !important;\n }\n\n .dc-lp-product-card:hover {\n box-shadow: var(--dc-lp-shadow-md) !important;\n transform: translateY(-2px) !important;\n }\n\n .dc-lp-product-image-wrapper {\n position: relative !important;\n width: 100% !important;\n padding-top: 177.77% !important;\n background: linear-gradient(135deg, #f5f3f0 0%, #e8e5e0 100%) !important;\n overflow: hidden !important;\n }\n\n .dc-lp-product-image {\n position: absolute !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n object-fit: cover !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-product-card:hover .dc-lp-product-image {\n transform: scale(1.05) !important;\n }\n\n .dc-lp-product-labels {\n position: absolute !important;\n top: 0.75rem !important;\n left: 0.75rem !important;\n display: flex !important;\n flex-direction: column !important;\n gap: 0.5rem !important;\n align-items: flex-start !important;\n }\n\n .dc-lp-product-label {\n background: rgba(255, 255, 255, 0.95) !important;\n backdrop-filter: blur(10px) !important;\n color: var(--dc-lp-text-primary) !important;\n font-size: 0.55rem !important;\n font-weight: 600 !important;\n padding: 0.35rem 0.65rem !important;\n border-radius: 4px !important;\n text-transform: uppercase !important;\n letter-spacing: 0.5px !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n }\n\n .dc-lp-discount-badge {\n position: absolute !important;\n top: 0.75rem !important;\n right: 0.75rem !important;\n background: #dc2626 !important;\n color: white !important;\n font-size: 0.75rem !important;\n font-weight: 700 !important;\n padding: 0.35rem 0.65rem !important;\n border-radius: 4px !important;\n box-shadow: var(--dc-lp-shadow-sm) !important;\n }\n\n .dc-lp-product-info {\n padding: 1rem !important;\n }\n\n .dc-lp-product-name {\n font-size: 1.05rem !important;\n font-weight: 600 !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.65rem !important;\n line-height: 1.3 !important;\n }\n\n .dc-lp-product-price-wrapper {\n display: none;\n align-items: center !important;\n gap: 0.65rem !important;\n margin-bottom: 0.85rem !important;\n }\n\n .dc-lp-product-price {\n font-size: 1.1rem !important;\n font-weight: 700 !important;\n color: var(--dc-lp-primary) !important;\n }\n\n .dc-lp-product-price-old {\n font-size: 0.85rem !important;\n color: var(--dc-lp-text-secondary) !important;\n text-decoration: line-through !important;\n }\n\n .dc-lp-preview-btn {\n width: 100% !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border: none !important;\n padding: 0.75rem 1.5rem !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 500 !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n gap: 0.5rem !important;\n }\n\n .dc-lp-preview-btn:hover {\n background: #1a1a1a !important;\n transform: translateY(-1px) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n }\n\n \/* Social Proof *\/\n .dc-lp-social-proof {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n }\n\n .dc-lp-testimonials {\n max-width: 1000px !important;\n margin: 0 auto !important;\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 1.5rem !important;\n }\n\n .dc-lp-testimonial-card {\n background: var(--dc-lp-bg-primary) !important;\n border-radius: 4px !important;\n border: 1px solid var(--dc-lp-border) !important;\n box-shadow: var(--dc-lp-shadow-md) !important;\n overflow: hidden !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-testimonial-card:hover {\n box-shadow: var(--dc-lp-shadow-lg) !important;\n transform: translateY(-4px) !important;\n }\n\n .dc-lp-testimonial-image {\n width: 100% !important;\n height: auto !important;\n display: block !important;\n object-fit: cover !important;\n }\n\n \/* How It Works *\/\n .dc-lp-how-it-works {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-primary) !important;\n }\n\n .dc-lp-steps {\n max-width: 900px !important;\n margin: 0 auto !important;\n display: grid !important;\n grid-template-columns: repeat(1, 1fr) !important;\n gap: 2rem !important;\n }\n\n .dc-lp-step {\n display: flex !important;\n gap: 1.5rem !important;\n align-items: flex-start !important;\n }\n\n .dc-lp-step-number {\n flex-shrink: 0 !important;\n width: 3rem !important;\n height: 3rem !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n font-size: 1.3rem !important;\n font-weight: 700 !important;\n }\n\n .dc-lp-step-content h3 {\n font-size: 1.25rem !important;\n font-weight: 500 !important;\n font-family: var(--font-heading) !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 0.5rem !important;\n }\n\n .dc-lp-step-content p {\n font-size: 0.95rem !important;\n color: var(--dc-lp-text-secondary) !important;\n line-height: 1.6 !important;\n }\n\n \/* Final CTA *\/\n .dc-lp-final-cta {\n padding: 3rem 1.5rem !important;\n background: var(--dc-lp-bg-secondary) !important;\n text-align: center !important;\n }\n\n .dc-lp-final-cta-title {\n font-size: 3.5rem !important;\n font-weight: 400 !important;\n color: var(--dc-lp-text-primary) !important;\n margin-bottom: 1rem !important;\n }\n\n .dc-lp-final-cta-text {\n font-size: 1.1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n margin-bottom: 2rem !important;\n }\n\n .dc-lp-urgency-text {\n display: inline-block !important;\n background: #fef3c7 !important;\n color: #92400e !important;\n padding: 0.5rem 1rem !important;\n border-radius: 2px !important;\n font-size: 0.9rem !important;\n font-weight: 600 !important;\n margin-bottom: 2rem !important;\n }\n\n \/* Booking Popup Modal *\/\n .dc-lp-popup-overlay {\n position: fixed !important;\n top: 0 !important;\n left: 0 !important;\n width: 100% !important;\n height: 100% !important;\n background: rgba(0, 0, 0, 0.7) !important;\n backdrop-filter: blur(5px) !important;\n z-index: 2000 !important;\n display: none !important;\n align-items: center !important;\n justify-content: center !important;\n padding: 1.5rem !important;\n animation: dc-lp-fadeIn 0.3s ease-out !important;\n }\n\n .dc-lp-popup-overlay.dc-lp-show {\n display: flex !important;\n }\n\n .dc-lp-popup-modal {\n background: white !important;\n border-radius: 4px !important;\n max-width: 500px !important;\n width: 100% !important;\n padding: 2rem !important;\n position: relative !important;\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3) !important;\n animation: dc-lp-slideUp 0.4s ease-out !important;\n }\n\n @keyframes dc-lp-slideUp {\n from {\n opacity: 0 !important;\n transform: translateY(30px) !important;\n }\n\n to {\n opacity: 1 !important;\n transform: translateY(0) !important;\n }\n }\n\n .dc-lp-popup-close {\n position: absolute !important;\n top: 1rem !important;\n right: 1rem !important;\n background: transparent !important;\n border: none !important;\n font-size: 1.5rem !important;\n color: #666 !important;\n cursor: pointer !important;\n width: 32px !important;\n height: 32px !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n border-radius: 50% !important;\n transition: var(--dc-lp-transition) !important;\n }\n\n .dc-lp-popup-close:hover {\n background: #f3f4f6 !important;\n color: #333 !important;\n }\n\n .dc-lp-popup-icon {\n width: 60px !important;\n height: 60px !important;\n background: var(--dc-lp-primary) !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n margin: 0 auto 1.5rem !important;\n font-size: 2rem !important;\n color: white !important;\n }\n\n .dc-lp-popup-title {\n font-size: 1.5rem !important;\n font-weight: 700 !important;\n color: var(--dc-lp-text-primary) !important;\n text-align: center !important;\n margin-bottom: 0.75rem !important;\n line-height: 1.3 !important;\n }\n\n .dc-lp-popup-subtitle {\n font-size: 1rem !important;\n color: var(--dc-lp-text-secondary) !important;\n text-align: center !important;\n margin-bottom: 1.5rem !important;\n line-height: 1.6 !important;\n }\n\n .dc-lp-popup-features {\n background: #f9fafb !important;\n border-radius: 2px !important;\n padding: 1.25rem !important;\n margin-bottom: 1.5rem !important;\n }\n\n .dc-lp-popup-feature {\n display: flex !important;\n align-items: flex-start !important;\n gap: 0.75rem !important;\n margin-bottom: 0.75rem !important;\n }\n\n .dc-lp-popup-feature:last-child {\n margin-bottom: 0 !important;\n }\n\n .dc-lp-popup-feature-icon {\n color: var(--dc-lp-accent) !important;\n font-size: 1.1rem !important;\n flex-shrink: 0 !important;\n margin-top: 0.1rem !important;\n }\n\n .dc-lp-popup-feature-text {\n font-size: 0.9rem !important;\n color: var(--dc-lp-text-primary) !important;\n line-height: 1.5 !important;\n }\n\n .dc-lp-popup-urgency {\n background: #fef3c7 !important;\n border-left: 4px solid #f59e0b !important;\n padding: 0.75rem 1rem !important;\n border-radius: 2px !important;\n margin-bottom: 1.5rem !important;\n display: flex !important;\n align-items: center !important;\n gap: 0.75rem !important;\n }\n\n .dc-lp-popup-urgency-icon {\n color: #f59e0b !important;\n font-size: 1.2rem !important;\n flex-shrink: 0 !important;\n }\n\n .dc-lp-popup-urgency-text {\n font-size: 0.85rem !important;\n color: #92400e !important;\n font-weight: 600 !important;\n line-height: 1.4 !important;\n }\n\n .dc-lp-popup-cta {\n width: 100% !important;\n background: var(--dc-lp-primary) !important;\n color: white !important;\n border: none !important;\n padding: 1rem 2rem !important;\n border-radius: 2px !important;\n font-size: 1rem !important;\n font-weight: 600 !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n font-family: inherit !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n gap: 0.5rem !important;\n text-decoration: none !important;\n }\n\n .dc-lp-popup-cta:hover {\n transform: translateY(-2px) !important;\n box-shadow: 0 8px 20px rgba(139, 115, 85, 0.3) !important;\n }\n\n \/* WhatsApp Floating Button *\/\n .dc-lp-wa-float {\n position: fixed !important;\n bottom: 2rem !important;\n right: 2rem !important;\n background: #25d366 !important;\n color: white !important;\n width: 50px !important;\n height: 50px !important;\n border-radius: 50% !important;\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n font-size: 1.8rem !important;\n box-shadow: 0 4px 20px rgba(37, 211, 102, 0.4) !important;\n cursor: pointer !important;\n transition: var(--dc-lp-transition) !important;\n z-index: 1000 !important;\n text-decoration: none !important;\n }\n\n .dc-lp-wa-float:hover {\n transform: scale(1.1) !important;\n box-shadow: 0 6px 25px rgba(37, 211, 102, 0.5) !important;\n }\n\n \/* Responsive *\/\n @media (min-width: 640px) {\n .dc-lp-props-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-product-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-features-grid {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-testimonials {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n\n .dc-lp-steps {\n grid-template-columns: repeat(3, 1fr) !important;\n }\n }\n\n @media (min-width: 1024px) {\n .dc-lp-hero {\n padding: 3rem 2rem !important;\n }\n\n .dc-lp-hero-headline {\n font-size: 4rem !important;\n }\n\n .dc-lp-props-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-product-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n gap: 1.5rem !important;\n }\n\n .dc-lp-features-grid {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-steps {\n grid-template-columns: repeat(4, 1fr) !important;\n }\n\n .dc-lp-value-props,\n .dc-lp-catalog,\n .dc-lp-social-proof,\n .dc-lp-how-it-works,\n .dc-lp-final-cta {\n padding: 4rem 2rem !important;\n }\n }\n\n @keyframes dc-lp-fadeIn {\n from {\n opacity: 0 !important;\n transform: translateY(10px) !important;\n }\n\n to {\n opacity: 1 !important;\n transform: translateY(0) !important;\n }\n }\n\n .dc-lp-product-card {\n animation: dc-lp-fadeIn 0.4s ease-out !important;\n }\n <\/style>\n<\/head>\n\n\n<div class=\"dc-lp-wrapper\">\n\n \n <section class=\"dc-lp-hero\">\n \n <div class=\"dc-lp-hero-bg\"><\/div>\n\n \n <div class=\"dc-lp-hero-overlay\"><\/div>\n\n \n <div class=\"dc-lp-hero-content\">\n <div class=\"dc-lp-logo\">inviteable<\/div>\n <div class=\"dc-lp-tagline\">a memorable invitation<\/div>\n\n <h1 class=\"dc-lp-hero-headline\">Bukan sekadar link \u2014 tapi <br><em>cerita cinta<\/em> yang hidup.\n <\/h1>\n <p class=\"dc-lp-hero-subheadline\">Teknologi Motion 3D, desain eksklusif, dan detail yang bikin beda.\n Dipercaya\n puluhan-ribu pasangan untuk momen yang cuma sekali seumur hidup.<\/p>\n\n <a href=\"#dc-lp-catalog-section\" class=\"dc-lp-hero-cta\">\n <i class=\"fas fa-sparkles\"><\/i>\n <span>Pilih Tema Favoritmu<\/span>\n <\/a>\n\n <div class=\"dc-lp-hero-stats\">\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-check-circle dc-lp-stat-icon\"><\/i>\n <span>Easy, Convenient<\/span>\n <\/div>\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-bolt dc-lp-stat-icon\"><\/i>\n <span>Team support<\/span>\n <\/div>\n <div class=\"dc-lp-stat-item\">\n <i class=\"fas fa-infinity dc-lp-stat-icon\"><\/i>\n <span>Unlimited Tamu<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <div class=\"dc-lp-sale-banner\">\n <span class=\"dc-lp-sale-text\">A LOVE CELEBRATION<\/span>\n <\/div>\n\n \n <section class=\"dc-lp-value-props\">\n <h2 class=\"dc-lp-section-title\">Kenapa Harus Pilih Kami?<\/h2>\n <div class=\"dc-lp-props-grid\">\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-paint-brush\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Desain yang Bikin Beda<\/h3>\n <p class=\"dc-lp-prop-desc\">Tamu kamu bakal mikir kamu hire wedding planner mahal. Padahal cuma mulai\n dari 100rb!<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-bolt\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Team Support<\/h3>\n <p class=\"dc-lp-prop-desc\">Ditemani hingga hari H. Kami siap membantu jika ada kendala.<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-gem\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Unlimited Tamu<\/h3>\n <p class=\"dc-lp-prop-desc\">Nggak ada yang ketinggalan di hari spesial kamu. Undang sebanyak yang kamu\n mau, tanpa batas.<\/p>\n <\/div>\n <div class=\"dc-lp-prop-card\">\n <div class=\"dc-lp-prop-icon\"><i class=\"fas fa-leaf\"><\/i><\/div>\n <h3 class=\"dc-lp-prop-title\">Ramah Lingkungan<\/h3>\n <p class=\"dc-lp-prop-desc\">Pilihan cerdas generasi kamu. Hemat kertas, hemat biaya, tetap elegan.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-features\">\n <h2 class=\"dc-lp-features-title\">Semua yang Kamu Butuhin, Udah Lengkap<\/h2>\n <div class=\"dc-lp-features-grid\">\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Nama Tamu Unlimited<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>20 Foto + 2 Mempelai<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Countdown Timer<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Info Rekening<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Maps Navigation<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>RSVP Kehadiran<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Custom Music<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Kisah Cinta<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Ucapan & Doa<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Video Prewed<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Live Wedding<\/span>\n <\/div>\n <div class=\"dc-lp-feature-item\">\n <i class=\"fas fa-check-circle dc-lp-feature-icon\"><\/i>\n <span>Share ke Sosmed<\/span>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-catalog\" id=\"dc-lp-catalog-section\">\n <div class=\"dc-lp-catalog-header\">\n <h2 class=\"dc-lp-catalog-title\">Pilih Tema yang Cocok Sama Vibe Kamu<\/h2>\n <p class=\"dc-lp-catalog-subtitle\">35+ tema eksklusif dengan berbagai style. Pilih yang paling cocok sama\n kamu!<\/p>\n <\/div>\n\n \n <div class=\"dc-lp-categories\">\n <button class=\"dc-lp-category-btn dc-lp-active\" data-label=\"Semua\">Semua<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"Motion 3D\">Motion 3D<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"New Design\">New Design<\/button>\n <button class=\"dc-lp-category-btn\" data-label=\"Nophoto\">Nophoto<\/button>\n <\/div>\n\n \n <div class=\"dc-lp-product-grid\" id=\"dc-lp-productGrid\">\n \n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-social-proof\">\n <h2 class=\"dc-lp-section-title\">Kata Mereka yang Udah Pakai<\/h2>\n <div class=\"dc-lp-testimonials\">\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194408.png\"\n alt=\"Instagram Comment Screenshot 1\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194343.png\"\n alt=\"Instagram Comment Screenshot 2\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <div class=\"dc-lp-testimonial-card\">\n <img decoding=\"async\" src=\"https:\/\/cdn.inviteable.id\/wp-content\/uploads\/2025\/12\/screenshot_20251215_194325.png\"\n alt=\"Instagram Comment Screenshot 3\" class=\"dc-lp-testimonial-image\">\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-how-it-works\">\n <h2 class=\"dc-lp-section-title\">Gampang Banget, Cuma 4 Langkah!<\/h2>\n <div class=\"dc-lp-steps\">\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">1<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Pilih Tema<\/h3>\n <p>Browse katalog kami dan pilih tema yang paling cocok sama vibe acara kamu.<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">2<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Isi Data<\/h3>\n <p>Kirim data acara, foto, dan musik pilihan kamu via WhatsApp. Gampang!<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">3<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Review & Revisi<\/h3>\n <p>Kami kirim preview ke kamu. Proses revisi. Done!<\/p>\n <\/div>\n <\/div>\n <div class=\"dc-lp-step\">\n <div class=\"dc-lp-step-number\">4<\/div>\n <div class=\"dc-lp-step-content\">\n <h3>Siap Dibagikan!<\/h3>\n <p>Undangan kamu siap! Langsung share ke tamu lewat WhatsApp atau sosmed.<\/p>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n\n \n <section class=\"dc-lp-final-cta\">\n <h2 class=\"dc-lp-final-cta-title\">Siap Bikin Undangan yang Unforgettable?<\/h2>\n <p class=\"dc-lp-final-cta-text\">Join puluhan ribu pasangan yang udah bikin momen spesial mereka makin berkesan\n <\/p>\n <div class=\"dc-lp-urgency-text\">\n <i class=\"fas fa-fire\"><\/i> Slot terbatas. Jangan tunda lagi!\n <\/div>\n <a href=\"#dc-lp-catalog-section\" class=\"dc-lp-hero-cta\">\n <i class=\"fas fa-rocket\"><\/i>\n <span>Mulai Sekarang<\/span>\n <\/a>\n <\/section>\n\n \n\n \n <div class=\"dc-lp-popup-overlay\" id=\"dcLpBookingPopup\">\n <div class=\"dc-lp-popup-modal\">\n <button class=\"dc-lp-popup-close\" id=\"dcLpClosePopup\">\n <i class=\"fas fa-times\"><\/i>\n <\/button>\n\n <div class=\"dc-lp-popup-icon\">\n <i class=\"fas fa-calendar-check\"><\/i>\n <\/div>\n\n <h3 class=\"dc-lp-popup-title\">Slot Terbatas! Booking Dulu Aja<\/h3>\n <p class=\"dc-lp-popup-subtitle\">Nggak perlu ribet! Data dan foto bisa menyusul nanti. Yang penting slot kamu\n aman dulu.<\/p>\n\n <div class=\"dc-lp-popup-features\">\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Booking sekarang<\/strong>, data dan foto kirim\n belakangan<\/span>\n <\/div>\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Slot terjamin<\/strong>, nggak khawatir\n kehabisan<\/span>\n <\/div>\n <div class=\"dc-lp-popup-feature\">\n <i class=\"fas fa-check-circle dc-lp-popup-feature-icon\"><\/i>\n <span class=\"dc-lp-popup-feature-text\"><strong>Hati tenang<\/strong>, Gak was-was dan terus kepikiran\n soal undangan<\/span>\n <\/div>\n <\/div>\n\n <div class=\"dc-lp-popup-urgency\">\n <i class=\"fas fa-fire dc-lp-popup-urgency-icon\"><\/i>\n <span class=\"dc-lp-popup-urgency-text\">Demi menjaga kualitas, jumlah undangan dibatasi tiap bulan-nya.\n Udah, jangan ditunda lagi!<\/span>\n <\/div>\n\n <a href=\"https:\/\/inviteable.id\/shop\/atc-1\/\" class=\"dc-lp-popup-cta\" target=\"_blank\">\n <i class=\"fab fa-whatsapp\"><\/i>\n <span>Booking Sekarang via WhatsApp<\/span>\n <\/a>\n <\/div>\n <\/div>\n\n<\/div>\n\n<script>\n \/\/ Data produk di-load dari file JSON terpisah agar mudah di-manage\n let dcLpProducts = [];\n\n \/\/ Calculate discount percentage\n function dcLpCalculateDiscount(oldPrice, newPrice) {\n const discount = ((oldPrice - newPrice) \/ oldPrice) * 100;\n return `-${Math.round(discount)}%`;\n }\n\n \/\/ Format currency\n function dcLpFormatCurrency(amount) {\n return new Intl.NumberFormat('id-ID', {\n style: 'currency',\n currency: 'IDR',\n minimumFractionDigits: 0\n }).format(amount);\n }\n\n \/\/ Render products\n function dcLpRenderProducts(productsToRender) {\n const productGrid = document.getElementById('dc-lp-productGrid');\n productGrid.innerHTML = productsToRender.map(product => `\n <div class=\"dc-lp-product-card\" data-id=\"${product.id}\">\n <div class=\"dc-lp-product-image-wrapper\">\n <img decoding=\"async\" src=\"${product.image}\" alt=\"${product.name}\" class=\"dc-lp-product-image\" style=\"object-fit:cover;object-position:top;\" loading=\"lazy\">\n <div class=\"dc-lp-product-labels\">\n ${product.labels.map(label => `<span class=\"dc-lp-product-label\">${label}<\/span>`).join('')}\n <\/div>\n <span class=\"dc-lp-discount-badge\">${dcLpCalculateDiscount(product.oldPrice, product.price)}<\/span>\n <\/div>\n <div class=\"dc-lp-product-info\">\n <h3 class=\"dc-lp-product-name\">${product.name}<\/h3>\n <div class=\"dc-lp-product-price-wrapper\">\n <span class=\"dc-lp-product-price-old\">${dcLpFormatCurrency(product.oldPrice)}<\/span>\n <span class=\"dc-lp-product-price\">${dcLpFormatCurrency(product.price)}<\/span>\n <\/div>\n <button class=\"dc-lp-preview-btn\" data-id=\"${product.id}\">\n <i class=\"fas fa-eye\"><\/i>\n <span>Preview<\/span>\n <\/button>\n <\/div>\n <\/div>\n `).join('');\n\n \/\/ Add event listeners for preview buttons\n document.querySelectorAll('.dc-lp-preview-btn').forEach(btn => {\n btn.addEventListener('click', (e) => {\n e.stopPropagation();\n const productId = parseInt(btn.dataset.id);\n const product = dcLpProducts.find(p => p.id === productId);\n if (product && product.previewLink) {\n window.open(product.previewLink, '_blank');\n }\n });\n });\n }\n\n \/\/ Fetch data dari file JSON lalu init semua fitur\n async function dcLpInitApp() {\n try {\n const response = await fetch('https:\/\/inviteable.id\/shop\/json\/data.json');\n dcLpProducts = await response.json();\n } catch (error) {\n console.warn('Remote fetch gagal, coba lokal...', error);\n try {\n const localResponse = await fetch('json\/data.json');\n dcLpProducts = await localResponse.json();\n } catch (localError) {\n console.error('Gagal memuat data produk:', localError);\n return;\n }\n }\n\n \/\/ Label filter\n document.querySelectorAll('.dc-lp-category-btn').forEach(btn => {\n btn.addEventListener('click', () => {\n document.querySelectorAll('.dc-lp-category-btn').forEach(b => b.classList.remove('dc-lp-active'));\n btn.classList.add('dc-lp-active');\n const label = btn.dataset.label;\n const filtered = label === 'Semua'\n ? dcLpProducts\n : dcLpProducts.filter(p => p.labels.includes(label));\n dcLpRenderProducts(filtered);\n });\n });\n\n \/\/ Smooth scroll for anchor links\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n const target = document.querySelector(this.getAttribute('href'));\n if (target) {\n target.scrollIntoView({\n behavior: 'smooth',\n block: 'start'\n });\n }\n });\n });\n\n \/\/ Booking Popup - Show when catalog section enters viewport\n const bookingPopup = document.getElementById('dcLpBookingPopup');\n const closePopupBtn = document.getElementById('dcLpClosePopup');\n const catalogSection = document.getElementById('dc-lp-catalog-section');\n let popupShown = false;\n\n function showBookingPopup() {\n if (!popupShown) {\n bookingPopup.classList.add('dc-lp-show');\n document.body.style.overflow = 'hidden';\n popupShown = true;\n }\n }\n\n function closeBookingPopup() {\n bookingPopup.classList.remove('dc-lp-show');\n document.body.style.overflow = '';\n }\n\n \/\/ Close popup on button click\n closePopupBtn.addEventListener('click', closeBookingPopup);\n\n \/\/ Close popup on overlay click\n bookingPopup.addEventListener('click', function (e) {\n if (e.target === bookingPopup) {\n closeBookingPopup();\n }\n });\n\n \/\/ Detect when catalog section enters viewport\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n showBookingPopup();\n }\n });\n }, {\n threshold: 0.1,\n rootMargin: '0px'\n });\n\n if (catalogSection) {\n observer.observe(catalogSection);\n }\n\n \/\/ Initial render\n dcLpRenderProducts(dcLpProducts);\n }\n\n \/\/ Jalankan init\n dcLpInitApp();\n<\/script>\n\n<\/html>","protected":false},"excerpt":{"rendered":"<p>inviteable – Undangan Digital yang Bikin Tamu Kamu Wow inviteable a memorable invitation Bukan sekadar link \u2014 tapi cerita cinta yang hidup. Teknologi Motion 3D, desain eksklusif, dan detail yang bikin beda. Dipercaya puluhan-ribu pasangan untuk momen yang cuma sekali seumur hidup. Pilih Tema Favoritmu Easy, Convenient Team support Unlimited Tamu A LOVE CELEBRATION Kenapa …<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"slim_seo":{"title":"Undangan Digital by: Inviteable","description":"inviteable - Undangan Digital yang Bikin Tamu Kamu Wow inviteable a memorable invitation Bukan sekadar link \u2014 tapi cerita cinta yang hidup. Teknologi Motion 3D,"},"footnotes":""},"class_list":["post-4503","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/comments?post=4503"}],"version-history":[{"count":19,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503\/revisions"}],"predecessor-version":[{"id":4560,"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/pages\/4503\/revisions\/4560"}],"wp:attachment":[{"href":"https:\/\/inviteable.id\/shop\/wp-json\/wp\/v2\/media?parent=4503"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}