{"version":"1.0","directionName":"Three Pulses","globalCss":":root {\n --bg-page: #f9fafb;\n --text-primary: #030712;\n --text-muted: #6b7280;\n --brand-primary: #3b82f6;\n --brand-secondary: #1d4ed8;\n --brand-accent: #60a5fa;\n --font-heading: 'Syne', sans-serif;\n --font-body: 'Plus Jakarta Sans', sans-serif;\n --radius: 24px;\n --border-color: rgba(59, 130, 246, 0.15);\n --c-bg: #f5f5f6;\n --c-ink: #111827;\n --c-primary: #0f172a;\n --c-accent: #0f172a;\n --c-secondary: #090d18;\n --c-success: #0f172a;\n --theme-primary: #0f172a;\n --theme-bg: #f5f5f6;\n --theme-ink: #111827;\n --theme-accent: #0f172a;\n --theme-secondary: #090d18;\n --theme-success: #0f172a;\n --bg: #f5f5f6;\n --ink: #111827;\n --border: #cfd0d4;\n}\n\n/* Typography & Core Reset */\n @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600&family=Syne:wght@700;800&display=swap');\n\n \n\n * {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n }\n\n \n\n /* Minimalist Header with Live Frequency Meter */\n[data-layout-root] .ds-site-header {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 72px;\n background: rgba(249, 250, 251, 0.85);\n backdrop-filter: blur(12px);\n -webkit-backdrop-filter: blur(12px);\n border-bottom: 1px solid var(--border-color);\n z-index: 100;\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0 40px;\n }\n\n[data-layout-root] .header-left {\n display: flex;\n align-items: center;\n gap: 32px;\n }\n\n[data-layout-root] .logo {\n font-family: var(--font-heading);\n font-weight: 800;\n font-size: 24px;\n text-decoration: none;\n color: var(--text-primary);\n letter-spacing: -1px;\n }\n\n[data-layout-root] .nav-menu {\n display: flex;\n gap: 24px;\n }\n\n[data-layout-root] .nav-link {\n font-size: 14px;\n font-weight: 500;\n text-decoration: none;\n color: var(--text-muted);\n transition: color 0.2s ease;\n }\n\n[data-layout-root] .nav-link:hover {\n color: var(--brand-primary);\n }\n\n /* Live Frequency Meter */\n[data-layout-root] .frequency-visualizer {\n display: flex;\n align-items: center;\n gap: 3px;\n height: 20px;\n }\n\n[data-layout-root] .freq-bar {\n width: 2px;\n height: 100%;\n background-color: var(--brand-accent);\n border-radius: 1px;\n animation: pulse-freq 1.2s ease-in-out infinite alternate;\n }\n\n[data-layout-root] .freq-bar:nth-child(2) { animation-delay: 0.15s; height: 60%; }\n[data-layout-root] .freq-bar:nth-child(3) { animation-delay: 0.3s; height: 80%; }\n[data-layout-root] .freq-bar:nth-child(4) { animation-delay: 0.45s; height: 40%; }\n[data-layout-root] .freq-bar:nth-child(5) { animation-delay: 0.6s; height: 95%; }\n\n @keyframes pulse-freq {\n 0% { transform: scaleY(0.3); }\n 100% { transform: scaleY(1); }\n }\n\n[data-layout-root] .header-actions {\n display: flex;\n align-items: center;\n gap: 20px;\n }\n\n[data-layout-root] .action-btn {\n background: none;\n border: none;\n color: var(--text-primary);\n font-family: var(--font-body);\n font-size: 14px;\n font-weight: 500;\n cursor: pointer;\n text-decoration: none;\n display: flex;\n align-items: center;\n gap: 6px;\n }\n\n[data-layout-root] .action-btn:hover {\n color: var(--brand-primary);\n }\n\n /* Hero Opening Section */\n[data-layout-root] .opening-section {\n position: relative;\n padding-top: 140px;\n padding-bottom: 80px;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n overflow: hidden;\n background: radial-gradient(circle at 80% 20%, rgba(96, 165, 250, 0.08) 0%, transparent 50%);\n }\n\n[data-layout-root] .ds-container {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 40px;\n width: 100%;\n position: relative;\n z-index: 10;\n }\n\n /* The Continuous Oscillating Vector Line */\n[data-layout-root] .vector-spine {\n position: absolute;\n top: 0;\n left: 50%;\n width: 100%;\n height: 100%;\n transform: translateX(-50%);\n pointer-events: none;\n z-index: 1;\n opacity: 0.45;\n }\n\n[data-layout-root] .vector-svg {\n width: 100%;\n height: 100%;\n }\n\n[data-layout-root] .oscillating-path {\n fill: none;\n stroke: url(#wave-gradient);\n stroke-width: 2;\n stroke-dasharray: 8, 4;\n animation: wave-flow 20s linear infinite;\n }\n\n @keyframes wave-flow {\n 0% { stroke-dashoffset: 0; }\n 100% { stroke-dashoffset: -400; }\n }\n\n /* Hero Grid Layout */\n[data-layout-root] .ds-hero-grid {\n display: grid;\n grid-template-columns: 1.1fr 0.9fr;\n gap: 60px;\n align-items: center;\n }\n\n[data-layout-root] .ds-hero-content {\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n\n[data-layout-root] .product-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background: rgba(59, 130, 246, 0.08);\n border: 1px solid rgba(59, 130, 246, 0.2);\n padding: 6px 16px;\n border-radius: 100px;\n width: fit-content;\n }\n\n[data-layout-root] .badge-dot {\n width: 6px;\n height: 6px;\n background-color: var(--brand-primary);\n border-radius: 50%;\n box-shadow: 0 0 8px var(--brand-accent);\n }\n\n[data-layout-root] .badge-text {\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--brand-secondary);\n }\n\n[data-layout-root] .ds-hero-title {\n font-family: var(--font-heading);\n font-size: clamp(40px, 5vw, 64px);\n line-height: 1.1;\n font-weight: 800;\n letter-spacing: -2px;\n color: var(--text-primary);\n }\n\n[data-layout-root] .ds-hero-title span {\n background: linear-gradient(135deg, var(--brand-primary), var(--brand-secondary));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n }\n\n[data-layout-root] .ds-hero-description {\n font-size: 18px;\n line-height: 1.6;\n color: var(--text-muted);\n max-width: 540px;\n }\n\n /* Mode Controller Interface */\n[data-layout-root] .mode-selector-group {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-top: 12px;\n }\n\n[data-layout-root] .mode-card {\n background: white;\n border: 1.5px solid rgba(59, 130, 246, 0.1);\n border-radius: var(--radius);\n padding: 20px;\n cursor: pointer;\n transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);\n position: relative;\n overflow: hidden;\n }\n\n[data-layout-root] .mode-card::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: radial-gradient(circle at top left, rgba(59, 130, 246, 0.05), transparent);\n opacity: 0;\n transition: opacity 0.3s ease;\n }\n\n[data-layout-root] .mode-card:hover {\n border-color: var(--brand-primary);\n transform: translateY(-4px);\n box-shadow: 0 12px 30px rgba(59, 130, 246, 0.08);\n }\n\n[data-layout-root] .mode-card:hover::before {\n opacity: 1;\n }\n\n[data-layout-root] .mode-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 12px;\n }\n\n[data-layout-root] .mode-title {\n font-size: 16px;\n font-weight: 700;\n color: var(--text-primary);\n }\n\n[data-layout-root] .mode-frequency {\n font-size: 11px;\n font-weight: 600;\n color: var(--brand-primary);\n background: rgba(59, 130, 246, 0.08);\n padding: 2px 8px;\n border-radius: 12px;\n }\n\n[data-layout-root] .mode-desc {\n font-size: 13px;\n color: var(--text-muted);\n line-height: 1.4;\n }\n\n[data-layout-root] .cta-group {\n display: flex;\n align-items: center;\n gap: 20px;\n margin-top: 16px;\n }\n\n[data-layout-root] .btn-primary {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background-color: var(--brand-primary);\n color: white;\n padding: 18px 36px;\n border-radius: var(--radius);\n font-weight: 600;\n font-size: 16px;\n text-decoration: none;\n transition: all 0.2s ease;\n border: 1px solid transparent;\n box-shadow: 0 10px 25px rgba(59, 130, 246, 0.25);\n }\n\n[data-layout-root] .btn-primary:hover {\n background-color: var(--brand-secondary);\n transform: translateY(-2px);\n box-shadow: 0 12px 30px rgba(29, 78, 216, 0.35);\n }\n\n /* Kinetic Interactive Art: Sonic Product Display */\n[data-layout-root] .sonic-display-wrapper {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 500px;\n }\n\n[data-layout-root] .sonic-ring-outer {\n position: absolute;\n width: 440px;\n height: 440px;\n border: 1px solid rgba(59, 130, 246, 0.1);\n border-radius: 50%;\n display: flex;\n justify-content: center;\n align-items: center;\n animation: spin-ring 30s linear infinite;\n }\n\n[data-layout-root] .sonic-ring-inner {\n width: 320px;\n height: 320px;\n border: 1px dashed rgba(96, 165, 250, 0.25);\n border-radius: 50%;\n position: absolute;\n animation: spin-ring-reverse 20s linear infinite;\n }\n\n @keyframes spin-ring {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n }\n\n @keyframes spin-ring-reverse {\n 0% { transform: rotate(360deg); }\n 100% { transform: rotate(0deg); }\n }\n\n /* Product Image Frame and Sonic Micro-Vibration */\n[data-layout-root] .product-image-container {\n position: relative;\n z-index: 5;\n width: 340px;\n height: 460px;\n background: linear-gradient(185deg, rgba(255, 255, 255, 0.9) 0%, rgba(243, 244, 246, 0.7) 100%);\n border: 1px solid rgba(255, 255, 255, 0.8);\n border-radius: var(--radius);\n overflow: hidden;\n box-shadow: 0 20px 50px rgba(0, 0, 0, 0.05);\n display: flex;\n justify-content: center;\n align-items: center;\n }\n\n[data-layout-root] .product-image-container::after {\n content: '';\n position: absolute;\n inset: 0;\n border-radius: var(--radius);\n padding: 2px;\n background: linear-gradient(to bottom, rgba(96, 165, 250, 0.4), transparent);\n -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n pointer-events: none;\n }\n\n[data-layout-root] .product-img {\n width: 85%;\n height: 85%;\n object-fit: contain;\n transition: transform 0.3s ease;\n }\n\n /* Trigger micro-frequency vibrations based on parent selector state simulator */\n[data-layout-root] .mode-card:hover ~ .sonic-display-wrapper .product-img,\n[data-layout-root] .product-image-container:hover .product-img {\n animation: micro-vibrate 0.08s linear infinite;\n }\n\n @keyframes micro-vibrate {\n 0% { transform: translate(1px, 1px) rotate(0deg); }\n 10% { transform: translate(-1px, -1px) rotate(-0.5deg); }\n 20% { transform: translate(-2px, 0px) rotate(0.5deg); }\n 30% { transform: translate(0px, 1px) rotate(0deg); }\n 40% { transform: translate(1px, -1px) rotate(1deg); }\n 50% { transform: translate(-1px, 1px) rotate(-0.5deg); }\n 60% { transform: translate(-2px, 1px) rotate(0deg); }\n 70% { transform: translate(1px, 1px) rotate(0.5deg); }\n 80% { transform: translate(-1px, -1px) rotate(1deg); }\n 90% { transform: translate(2px, 1px) rotate(0deg); }\n 100% { transform: translate(1px, -2px) rotate(-0.5deg); }\n }\n\n /* Sonic Waves Exploding Off Head (Design Motif) */\n[data-layout-root] .sonic-particle {\n position: absolute;\n width: 6px;\n height: 6px;\n background-color: var(--brand-accent);\n border-radius: 50%;\n opacity: 0.8;\n }\n\n[data-layout-root] .p1 { top: 20%; left: 30%; animation: float-p 3s infinite ease-in-out; }\n[data-layout-root] .p2 { top: 15%; right: 25%; animation: float-p 4s infinite ease-in-out 1s; }\n[data-layout-root] .p3 { bottom: 25%; left: 20%; animation: float-p 5s infinite ease-in-out 0.5s; }\n\n @keyframes float-p {\n 0%, 100% { transform: translateY(0) scale(1); opacity: 0.3; }\n 50% { transform: translateY(-15px) scale(1.5); opacity: 0.8; }\n }\n\n /* Responsive Design overrides */\n @media (max-width: 1024px) {\n[data-layout-root] .ds-hero-grid {\n grid-template-columns: 1fr;\n gap: 48px;\n text-align: center;\n }\n[data-layout-root] .ds-hero-content {\n align-items: center;\n }\n[data-layout-root] .ds-hero-description {\n margin: 0 auto;\n }\n[data-layout-root] .mode-selector-group {\n width: 100%;\n }\n[data-layout-root] .sonic-display-wrapper {\n min-height: 420px;\n }\n[data-layout-root] .ds-site-header {\n padding: 0 20px;\n }\n }\n\n @media (max-width: 640px) {\n[data-layout-root] .mode-selector-group {\n grid-template-columns: 1fr;\n }\n[data-layout-root] .ds-site-header {\n height: 64px;\n }\n[data-layout-root] .opening-section {\n padding-top: 100px;\n padding-bottom: 40px;\n }\n[data-layout-root] .nav-menu {\n display: none; /* Accessible via mobile-menu context */\n }\n[data-layout-root] .product-image-container {\n width: 280px;\n height: 380px;\n }\n }\n\n /* Accessibility preference */\n @media (prefers-reduced-motion: reduce) {\n[data-layout-root] .oscillating-path, .freq-bar, .sonic-ring-outer, .sonic-ring-inner, .sonic-particle, .product-img {\n animation: none !important;\n transform: none !important;\n }\n[data-layout-root] .mode-card:hover {\n transform: none !important;\n }\n }\n \n\n@media (max-width:760px){\n[data-layout-root] header{max-width:100%!important;min-width:0!important;display:flex!important;align-items:center!important;gap:12px!important;overflow:visible!important}\n[data-layout-root] header [data-slot=\"nav\"],header [data-slot=\"search\"],header [data-slot=\"login\"],header [data-slot=\"currency\"]{display:none!important}\n[data-layout-root] header [data-slot=\"logo\"]{display:flex!important;visibility:visible!important;opacity:1!important;position:static!important;margin-right:auto!important;min-width:0!important}\n[data-layout-root] header [data-slot=\"cart\"],header [data-slot=\"mobile-menu\"]{display:flex!important;visibility:visible!important;opacity:1!important;position:static!important;transform:none!important;white-space:nowrap!important}\n[data-layout-root] header *:has(>[data-slot=\"cart\"]),header *:has(>[data-slot=\"mobile-menu\"]){display:flex!important;visibility:visible!important;align-items:center!important;gap:10px!important}\n}\n\n /* --- EXTENSION DESIGN SYSTEM --- */\n[data-layout-root] .ds-trust-strip {\n background-color: var(--bg-page);\n padding: 32px 0;\n border-top: 1px solid var(--border-color);\n border-bottom: 1px solid var(--border-color);\n position: relative;\n z-index: 10;\n }\n\n[data-layout-root] .ds-trust-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));\n gap: 32px;\n align-items: center;\n }\n\n[data-layout-root] .ds-trust-item {\n display: flex;\n align-items: flex-start;\n gap: 16px;\n }\n\n[data-layout-root] .ds-trust-icon-wrapper {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 48px;\n height: 48px;\n border-radius: 50%;\n background: rgba(59, 130, 246, 0.08);\n border: 1px solid rgba(59, 130, 246, 0.15);\n color: var(--brand-primary);\n flex-shrink: 0;\n }\n\n[data-layout-root] .ds-trust-icon {\n width: 20px;\n height: 20px;\n stroke: currentColor;\n fill: none;\n stroke-width: 2;\n stroke-linecap: round;\n stroke-linejoin: round;\n }\n\n[data-layout-root] .ds-trust-content {\n display: flex;\n flex-direction: column;\n gap: 4px;\n }\n\n[data-layout-root] .ds-trust-title {\n font-family: var(--font-body);\n font-size: 15px;\n font-weight: 700;\n color: var(--text-primary);\n letter-spacing: -0.3px;\n }\n\n[data-layout-root] .ds-trust-desc {\n font-size: 13px;\n color: var(--text-muted);\n line-height: 1.4;\n }\n\n /* --- FEATURES SECTION --- */\n[data-layout-root] .ds-features-section {\n background-color: #ffffff;\n padding: 100px 0;\n position: relative;\n overflow: hidden;\n }\n\n[data-layout-root] .ds-features-intro {\n max-width: 640px;\n margin-bottom: 64px;\n }\n\n[data-layout-root] .ds-features-badge {\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background: rgba(59, 130, 246, 0.06);\n border: 1px solid rgba(59, 130, 246, 0.12);\n padding: 4px 12px;\n border-radius: 100px;\n margin-bottom: 16px;\n }\n\n[data-layout-root] .ds-features-badge-dot {\n width: 6px;\n height: 6px;\n background-color: var(--brand-primary);\n border-radius: 50%;\n }\n\n[data-layout-root] .ds-features-badge-text {\n font-size: 11px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--brand-secondary);\n }\n\n[data-layout-root] .ds-features-headline {\n font-family: var(--font-heading);\n font-size: clamp(32px, 4vw, 48px);\n font-weight: 800;\n letter-spacing: -1.5px;\n line-height: 1.15;\n color: var(--text-primary);\n margin-bottom: 16px;\n }\n\n[data-layout-root] .ds-features-subhead {\n font-size: 16px;\n line-height: 1.6;\n color: var(--text-muted);\n }\n\n[data-layout-root] .ds-features-layout {\n display: grid;\n grid-template-columns: 1.1fr 0.9fr;\n gap: 80px;\n align-items: center;\n }\n\n[data-layout-root] .ds-features-list {\n display: flex;\n flex-direction: column;\n gap: 40px;\n }\n\n[data-layout-root] .ds-feature-card {\n display: flex;\n gap: 24px;\n padding-bottom: 32px;\n border-bottom: 1px solid rgba(59, 130, 246, 0.1);\n }\n\n[data-layout-root] .ds-feature-card:last-child {\n border-bottom: none;\n padding-bottom: 0;\n }\n\n[data-layout-root] .ds-feature-num {\n font-family: var(--font-heading);\n font-size: 20px;\n font-weight: 800;\n color: var(--brand-accent);\n line-height: 1;\n margin-top: 4px;\n }\n\n[data-layout-root] .ds-feature-details {\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n[data-layout-root] .ds-feature-name {\n font-family: var(--font-body);\n font-size: 18px;\n font-weight: 700;\n color: var(--text-primary);\n letter-spacing: -0.4px;\n }\n\n[data-layout-root] .ds-feature-text {\n font-size: 14px;\n line-height: 1.6;\n color: var(--text-muted);\n }\n\n /* Interactive Visual Presentation with micro-glows */\n[data-layout-root] .ds-features-visual-wrapper {\n position: relative;\n border-radius: var(--radius);\n overflow: hidden;\n aspect-ratio: 4/5;\n background: #f3f4f6;\n border: 1px solid var(--border-color);\n box-shadow: 0 20px 40px rgba(0, 0, 0, 0.03);\n }\n\n[data-layout-root] .ds-features-img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n transition: transform 0.8s cubic-bezier(0.25, 1, 0.5, 1);\n }\n\n[data-layout-root] .ds-features-visual-wrapper:hover .ds-features-img {\n transform: scale(1.03);\n }\n\n[data-layout-root] .ds-features-overlay {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n padding: 32px;\n background: linear-gradient(to top, rgba(3, 7, 18, 0.85) 0%, rgba(3, 7, 18, 0) 100%);\n color: #ffffff;\n display: flex;\n flex-direction: column;\n gap: 8px;\n }\n\n[data-layout-root] .ds-overlay-label {\n font-size: 11px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n color: var(--brand-accent);\n }\n\n[data-layout-root] .ds-overlay-title {\n font-family: var(--font-heading);\n font-size: 20px;\n font-weight: 700;\n letter-spacing: -0.5px;\n }\n\n /* Subscription Prompters & Action hooks in visual continuity */\n[data-layout-root] .ds-subscribe-banner {\n margin-top: 48px;\n background: linear-gradient(135deg, rgba(59, 130, 246, 0.04) 0%, rgba(29, 78, 216, 0.04) 100%);\n border: 1.5px dashed rgba(59, 130, 246, 0.25);\n border-radius: var(--radius);\n padding: 32px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 32px;\n }\n\n[data-layout-root] .ds-subscribe-info {\n display: flex;\n flex-direction: column;\n gap: 6px;\n max-width: 580px;\n }\n\n[data-layout-root] .ds-subscribe-title {\n font-family: var(--font-body);\n font-size: 16px;\n font-weight: 700;\n color: var(--text-primary);\n }\n\n[data-layout-root] .ds-subscribe-desc {\n font-size: 13px;\n color: var(--text-muted);\n line-height: 1.5;\n }\n\n[data-layout-root] .ds-subscribe-cta {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n background-color: var(--brand-primary);\n color: #ffffff;\n padding: 14px 28px;\n border-radius: var(--radius);\n font-weight: 600;\n font-size: 14px;\n text-decoration: none;\n white-space: nowrap;\n transition: all 0.2s ease;\n box-shadow: 0 4px 14px rgba(59, 130, 246, 0.15);\n }\n\n[data-layout-root] .ds-subscribe-cta:hover {\n background-color: var(--brand-secondary);\n transform: translateY(-1px);\n box-shadow: 0 6px 20px rgba(29, 78, 216, 0.25);\n }\n\n @media (max-width: 991px) {\n[data-layout-root] .ds-features-layout {\n grid-template-columns: 1fr;\n gap: 48px;\n }\n \n[data-layout-root] .ds-subscribe-banner {\n flex-direction: column;\n align-items: flex-start;\n gap: 20px;\n }\n \n[data-layout-root] .ds-subscribe-cta {\n width: 100%;\n }\n }\n\n /* --- DESIGN CONTINUITY & VARIABLES --- */\n /* Using variables from the canonical design seed */\n[data-layout-root] .ds-pdp-wrapper {\n --bg-page: #f5f5f6;\n --text-primary: #111827;\n --text-muted: #6B7280;\n --brand-primary: #0f172a;\n --brand-secondary: #090d18;\n --brand-accent: #0f172a;\n --font-heading: 'Syne', sans-serif;\n --font-body: 'Plus Jakarta Sans', sans-serif;\n --radius: 12px;\n --border-color: #cfd0d4;\n \n /* Concept Specifics: Clinical Cool Blue Lighting & Ultrasonic energy */\n --clinical-blue: #3b82f6;\n --clinical-glow: rgba(59, 130, 246, 0.15);\n --clinical-edge: rgba(59, 130, 246, 0.3);\n\n font-family: var(--font-body);\n background-color: var(--bg-page);\n color: var(--text-primary);\n -webkit-font-smoothing: antialiased;\n padding-top: 100px; /* Offset for canonical absolute header */\n overflow-x: hidden;\n }\n\n /* --- BREADCRUMBS --- */\n[data-layout-root] .ds-breadcrumbs {\n max-width: 1280px;\n margin: 0 auto;\n padding: 24px 40px 12px 40px;\n font-size: 13px;\n font-weight: 500;\n letter-spacing: 0.5px;\n color: var(--text-muted);\n text-transform: uppercase;\n }\n[data-layout-root] .ds-breadcrumbs span {\n color: var(--text-primary);\n }\n\n /* --- PDP HERO LAYOUT --- */\n[data-layout-root] .ds-pdp-main {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 40px 80px 40px;\n display: grid;\n grid-template-columns: 1.1fr 0.9fr;\n gap: 80px;\n align-items: start;\n }\n\n @media (max-width: 1024px) {\n[data-layout-root] .ds-pdp-main {\n grid-template-columns: 1fr;\n gap: 40px;\n padding: 0 24px 60px 24px;\n }\n[data-layout-root] .ds-breadcrumbs {\n padding: 16px 24px 12px 24px;\n }\n }\n\n /* --- LEFT COLUMN: GALLERY & SONIC DISPLAY --- */\n[data-layout-root] .ds-gallery-column {\n position: sticky;\n top: 100px;\n display: flex;\n flex-direction: column;\n gap: 24px;\n }\n\n /* Clinical hyper-clean frame around dynamic slot gallery */\n[data-layout-root] .ds-gallery-container {\n background: #ffffff;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n padding: 24px;\n position: relative;\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02);\n overflow: hidden;\n }\n\n /* Cool-blue ultrasonic edge lighting effect */\n[data-layout-root] .ds-gallery-container::after {\n content: '';\n position: absolute;\n inset: 0;\n border: 2px solid transparent;\n border-radius: var(--radius);\n background: linear-gradient(135deg, var(--clinical-blue), transparent, var(--clinical-blue)) border-box;\n -webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);\n -webkit-mask-composite: xor;\n mask-composite: exclude;\n pointer-events: none;\n opacity: 0.5;\n }\n\n /* Slot gallery styling projection compatibility */\n[data-layout-root] .slot-gallery {\n width: 100%;\n aspect-ratio: 1 / 1;\n display: flex;\n align-items: center;\n justify-content: center;\n background: #fdfdfd;\n border-radius: calc(var(--radius) - 4px);\n overflow: hidden;\n }\n\n[data-layout-root] .slot-gallery img {\n max-width: 100%;\n height: auto;\n object-fit: contain;\n transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);\n }\n\n /* Mode/Frequency Visualizer Panel built below visual */\n[data-layout-root] .ds-sonic-visualizer {\n background: #ffffff;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n padding: 20px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n[data-layout-root] .ds-sonic-status {\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 12px;\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--clinical-blue);\n }\n\n[data-layout-root] .ds-sonic-status span {\n color: var(--text-primary);\n }\n\n /* Mini frequency meter mimicking vibration */\n[data-layout-root] .ds-frequency-bar-group {\n display: flex;\n align-items: flex-end;\n gap: 4px;\n height: 32px;\n background: rgba(59, 130, 246, 0.04);\n border-radius: 6px;\n padding: 6px 12px;\n border: 1px dashed rgba(59, 130, 246, 0.2);\n }\n\n[data-layout-root] .ds-freq-bar-pdp {\n flex: 1;\n background-color: var(--clinical-blue);\n border-radius: 1px;\n height: 20%;\n animation: pulse-freq-pdp 1s ease-in-out infinite alternate;\n }\n\n[data-layout-root] .ds-freq-bar-pdp:nth-child(2) { animation-delay: 0.1s; height: 50%; }\n[data-layout-root] .ds-freq-bar-pdp:nth-child(3) { animation-delay: 0.2s; height: 80%; }\n[data-layout-root] .ds-freq-bar-pdp:nth-child(4) { animation-delay: 0.3s; height: 40%; }\n[data-layout-root] .ds-freq-bar-pdp:nth-child(5) { animation-delay: 0.15s; height: 90%; }\n[data-layout-root] .ds-freq-bar-pdp:nth-child(6) { animation-delay: 0.25s; height: 60%; }\n[data-layout-root] .ds-freq-bar-pdp:nth-child(7) { animation-delay: 0.35s; height: 30%; }\n\n @keyframes pulse-freq-pdp {\n 0% { transform: scaleY(0.4); opacity: 0.7; }\n 100% { transform: scaleY(1); opacity: 1; }\n }\n\n /* --- RIGHT COLUMN: ORDER FLOW --- */\n[data-layout-root] .ds-product-info-column {\n display: flex;\n flex-direction: column;\n gap: 28px;\n }\n\n[data-layout-root] .ds-brand-pill {\n align-self: flex-start;\n display: inline-flex;\n align-items: center;\n gap: 8px;\n background: rgba(15, 23, 42, 0.05);\n border: 1px solid var(--border-color);\n padding: 6px 14px;\n border-radius: 100px;\n font-size: 11px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 1px;\n color: var(--brand-primary);\n }\n\n /* Real User Transformations Banner right below Hero */\n[data-layout-root] .ds-social-proof-banner {\n display: flex;\n align-items: center;\n gap: 12px;\n background: #ffffff;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n padding: 12px 18px;\n }\n\n[data-layout-root] .ds-avatars-group {\n display: flex;\n align-items: center;\n }\n\n[data-layout-root] .ds-avatar {\n width: 32px;\n height: 32px;\n border-radius: 50%;\n border: 2px solid #ffffff;\n margin-right: -8px;\n background-color: var(--border-color);\n object-fit: cover;\n }\n\n[data-layout-root] .ds-avatar:last-child {\n margin-right: 0;\n }\n\n[data-layout-root] .ds-rating-info {\n display: flex;\n flex-direction: column;\n }\n\n[data-layout-root] .ds-stars {\n color: #f59e0b;\n font-size: 14px;\n line-height: 1;\n margin-bottom: 2px;\n }\n\n[data-layout-root] .ds-rating-text {\n font-size: 12px;\n font-weight: 600;\n color: var(--text-primary);\n }\n\n /* --- PRODUCT SLOTS --- */\n[data-layout-root] .slot-title {\n font-family: var(--font-heading);\n font-size: 44px;\n font-weight: 800;\n line-height: 1.1;\n letter-spacing: -1.5px;\n color: var(--text-primary);\n }\n\n[data-layout-root] .slot-price {\n font-family: var(--font-heading);\n font-size: 28px;\n font-weight: 700;\n color: var(--brand-primary);\n letter-spacing: -0.5px;\n }\n\n[data-layout-root] .slot-description {\n font-size: 15px;\n line-height: 1.6;\n color: var(--text-muted);\n }\n\n[data-layout-root] .slot-variants {\n display: block;\n width: 100%;\n border: 1px solid var(--border-color);\n background: #ffffff;\n border-radius: var(--radius);\n padding: 16px;\n }\n\n[data-layout-root] .slot-quantity {\n display: block;\n width: 100%;\n border: 1px solid var(--border-color);\n background: #ffffff;\n border-radius: var(--radius);\n padding: 12px 16px;\n }\n\n /* Primary Conversion Add to Cart */\n[data-layout-root] .slot-add-to-cart {\n display: block !important;\n width: 100% !important;\n visibility: visible !important;\n opacity: 1 !important;\n margin: 8px 0;\n }\n\n[data-layout-root] .slot-add-to-cart button,\n[data-layout-root] .slot-add-to-cart .ds-btn,\n[data-layout-root] .slot-add-to-cart a,\n[data-layout-root] .slot-add-to-cart input[type=\"submit\"] {\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n width: 100% !important;\n background-color: var(--brand-primary) !important;\n color: #ffffff !important;\n font-family: var(--font-body) !important;\n font-size: 16px !important;\n font-weight: 700 !important;\n text-transform: uppercase !important;\n letter-spacing: 1px !important;\n padding: 18px 32px !important;\n border-radius: var(--radius) !important;\n border: none !important;\n cursor: pointer !important;\n transition: all 0.2s ease !important;\n box-shadow: 0 10px 20px rgba(15, 23, 42, 0.15) !important;\n }\n\n[data-layout-root] .slot-add-to-cart button:hover,\n[data-layout-root] .slot-add-to-cart .ds-btn:hover {\n background-color: var(--brand-secondary) !important;\n transform: translateY(-2px) !important;\n box-shadow: 0 12px 24px rgba(15, 23, 42, 0.25) !important;\n }\n\n /* Secondary Buy Now Style */\n[data-layout-root] .slot-buy-now {\n display: block !important;\n width: 100% !important;\n visibility: visible !important;\n opacity: 1 !important;\n }\n\n[data-layout-root] .slot-buy-now button,\n[data-layout-root] .slot-buy-now .ds-btn,\n[data-layout-root] .slot-buy-now a {\n display: flex !important;\n align-items: center !important;\n justify-content: center !important;\n width: 100% !important;\n background-color: transparent !important;\n color: var(--text-primary) !important;\n font-family: var(--font-body) !important;\n font-size: 15px !important;\n font-weight: 600 !important;\n padding: 14px 32px !important;\n border-radius: var(--radius) !important;\n border: 1.5px solid var(--border-color) !important;\n cursor: pointer !important;\n transition: all 0.2s ease !important;\n }\n\n[data-layout-root] .slot-buy-now button:hover,\n[data-layout-root] .slot-buy-now .ds-btn:hover {\n border-color: var(--brand-primary) !important;\n background-color: rgba(15, 23, 42, 0.02) !important;\n }\n\n /* --- RECURRING SUBSCRIPTION CALLOUT --- */\n[data-layout-root] .ds-subscription-prompt {\n background: linear-gradient(135deg, rgba(59, 130, 246, 0.03), rgba(59, 130, 246, 0.08));\n border: 1.5px dashed var(--clinical-blue);\n border-radius: var(--radius);\n padding: 20px;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n[data-layout-root] .ds-sub-header {\n display: flex;\n align-items: center;\n gap: 10px;\n font-weight: 700;\n font-size: 14px;\n color: var(--brand-primary);\n }\n\n[data-layout-root] .ds-sub-icon {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 24px;\n height: 24px;\n border-radius: 50%;\n background: var(--clinical-blue);\n color: white;\n font-size: 10px;\n }\n\n[data-layout-root] .ds-sub-text {\n font-size: 13px;\n line-height: 1.5;\n color: var(--text-muted);\n }\n\n[data-layout-root] .ds-sub-text span {\n font-weight: 700;\n color: var(--clinical-blue);\n }\n\n /* --- SHIPPING & DELIVERY INFO --- */\n[data-layout-root] .ds-shipping-info {\n border-top: 1px solid var(--border-color);\n padding-top: 24px;\n margin-top: 8px;\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 16px;\n }\n\n[data-layout-root] .ds-ship-item {\n display: flex;\n align-items: flex-start;\n gap: 12px;\n }\n\n[data-layout-root] .ds-ship-icon {\n font-size: 18px;\n color: var(--clinical-blue);\n flex-shrink: 0;\n }\n\n[data-layout-root] .ds-ship-title {\n font-size: 12px;\n font-weight: 700;\n color: var(--text-primary);\n margin-bottom: 2px;\n text-transform: uppercase;\n letter-spacing: 0.5px;\n }\n\n[data-layout-root] .ds-ship-desc {\n font-size: 11px;\n color: var(--text-muted);\n line-height: 1.4;\n }\n\n /* --- THREE MODES DETAIL SECTION --- */\n[data-layout-root] .ds-about-modes {\n background: #ffffff;\n border-top: 1px solid var(--border-color);\n border-bottom: 1px solid var(--border-color);\n padding: 80px 0;\n }\n\n[data-layout-root] .ds-section-header {\n text-align: center;\n max-width: 600px;\n margin: 0 auto 48px auto;\n }\n\n[data-layout-root] .ds-section-label {\n font-size: 12px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 2px;\n color: var(--clinical-blue);\n margin-bottom: 12px;\n display: block;\n }\n\n[data-layout-root] .ds-section-title {\n font-family: var(--font-heading);\n font-size: 36px;\n font-weight: 800;\n letter-spacing: -1px;\n color: var(--text-primary);\n }\n\n[data-layout-root] .ds-modes-grid {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 40px;\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 32px;\n }\n\n @media (max-width: 768px) {\n[data-layout-root] .ds-modes-grid {\n grid-template-columns: 1fr;\n gap: 24px;\n padding: 0 24px;\n }\n }\n\n[data-layout-root] .ds-mode-card-detailed {\n background: var(--bg-page);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n padding: 32px;\n transition: transform 0.3s ease, border-color 0.3s ease;\n }\n\n[data-layout-root] .ds-mode-card-detailed:hover {\n transform: translateY(-4px);\n border-color: var(--clinical-blue);\n }\n\n[data-layout-root] .ds-card-freq-pill {\n background: rgba(59, 130, 246, 0.08);\n color: var(--clinical-blue);\n font-weight: 700;\n font-size: 11px;\n padding: 4px 10px;\n border-radius: 100px;\n display: inline-block;\n margin-bottom: 16px;\n }\n\n[data-layout-root] .ds-card-title {\n font-family: var(--font-heading);\n font-size: 20px;\n font-weight: 700;\n color: var(--text-primary);\n margin-bottom: 12px;\n }\n\n[data-layout-root] .ds-card-desc {\n font-size: 14px;\n line-height: 1.5;\n color: var(--text-muted);\n }\n\n /* Footer Component - Kinetic Minimalism */\n[data-layout-root] .ds-footer {\n position: relative;\n background-color: var(--bg-page, #f5f5f6);\n color: var(--text-primary, #030712);\n font-family: var(--font-body, 'Plus Jakarta Sans', sans-serif);\n border-top: 1px solid var(--border-color, rgba(59, 130, 246, 0.15));\n padding: 80px 0 40px 0;\n overflow: hidden;\n }\n\n /* Decorative Kinetic Grid Background to match the Sonic Concept */\n[data-layout-root] .ds-footer::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-image: \n radial-gradient(circle at 10% 20%, rgba(96, 165, 250, 0.03) 0%, transparent 40%),\n radial-gradient(circle at 90% 80%, rgba(59, 130, 246, 0.04) 0%, transparent 50%);\n pointer-events: none;\n z-index: 1;\n }\n\n[data-layout-root] .ds-footer-container {\n max-width: 1280px;\n margin: 0 auto;\n padding: 0 40px;\n position: relative;\n z-index: 2;\n }\n\n /* Main Grid Layout */\n[data-layout-root] .ds-footer-grid {\n display: grid;\n grid-template-columns: 1.2fr 2fr;\n gap: 80px;\n margin-bottom: 60px;\n }\n\n @media (max-width: 1024px) {\n[data-layout-root] .ds-footer-grid {\n grid-template-columns: 1fr;\n gap: 48px;\n }\n }\n\n /* Brand / Newsletter Column */\n[data-layout-root] .ds-footer-brand-zone {\n display: flex;\n flex-direction: column;\n gap: 32px;\n }\n\n[data-layout-root] .ds-footer-brand-logo {\n display: inline-block;\n font-family: var(--font-heading, 'Syne', sans-serif);\n font-weight: 800;\n font-size: 28px;\n text-decoration: none;\n color: var(--text-primary, #030712);\n letter-spacing: -1px;\n transition: opacity 0.2s ease;\n }\n\n[data-layout-root] .ds-footer-brand-logo:hover {\n opacity: 0.9;\n }\n\n[data-layout-root] .ds-footer-tagline {\n font-size: 15px;\n line-height: 1.6;\n color: var(--text-muted, #6b7280);\n max-width: 320px;\n }\n\n /* Newsletter Box */\n[data-layout-root] .ds-footer-newsletter-wrap {\n background: #ffffff;\n border: 1.5px solid var(--border-color, rgba(59, 130, 246, 0.15));\n border-radius: var(--radius, 24px);\n padding: 24px;\n box-shadow: 0 10px 30px rgba(59, 130, 246, 0.03);\n position: relative;\n }\n\n[data-layout-root] .ds-footer-newsletter-heading {\n font-family: var(--font-heading, 'Syne', sans-serif);\n font-size: 16px;\n font-weight: 700;\n margin-bottom: 8px;\n letter-spacing: -0.5px;\n }\n\n[data-layout-root] .ds-footer-newsletter-sub {\n font-size: 13px;\n color: var(--text-muted, #6b7280);\n margin-bottom: 16px;\n line-height: 1.4;\n }\n\n[data-layout-root] .ds-footer-form {\n display: flex;\n gap: 8px;\n }\n\n[data-layout-root] .ds-footer-input {\n flex: 1;\n background: var(--bg-page, #f5f5f6);\n border: 1px solid var(--border-color, rgba(59, 130, 246, 0.15));\n border-radius: 12px;\n padding: 12px 16px;\n font-family: var(--font-body, sans-serif);\n font-size: 14px;\n color: var(--text-primary, #030712);\n transition: all 0.2s ease;\n }\n\n[data-layout-root] .ds-footer-input:focus {\n outline: none;\n border-color: var(--brand-primary, #3b82f6);\n background: #ffffff;\n }\n\n[data-layout-root] .ds-footer-submit {\n background: var(--brand-primary, #3b82f6);\n color: #ffffff;\n border: none;\n border-radius: 12px;\n padding: 0 20px;\n font-family: var(--font-body, sans-serif);\n font-weight: 600;\n font-size: 14px;\n cursor: pointer;\n transition: all 0.2s ease;\n }\n\n[data-layout-root] .ds-footer-submit:hover {\n background: var(--brand-secondary, #1d4ed8);\n }\n\n /* Navigation Links Block */\n[data-layout-root] .ds-footer-nav-columns {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 32px;\n }\n\n @media (max-width: 640px) {\n[data-layout-root] .ds-footer-nav-columns {\n grid-template-columns: 1fr;\n gap: 24px;\n }\n }\n\n[data-layout-root] .ds-footer-column-title {\n font-family: var(--font-heading, 'Syne', sans-serif);\n font-size: 13px;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 1.5px;\n color: var(--text-primary, #030712);\n margin-bottom: 20px;\n position: relative;\n display: inline-block;\n }\n\n[data-layout-root] .ds-footer-column-title::after {\n content: '';\n position: absolute;\n bottom: -6px;\n left: 0;\n width: 16px;\n height: 2px;\n background-color: var(--brand-primary, #3b82f6);\n }\n\n[data-layout-root] .ds-footer-list {\n list-style: none;\n padding: 0;\n margin: 0;\n display: flex;\n flex-direction: column;\n gap: 12px;\n }\n\n[data-layout-root] .ds-footer-link {\n font-size: 14px;\n color: var(--text-muted, #6b7280);\n text-decoration: none;\n transition: all 0.2s ease;\n display: inline-block;\n }\n\n[data-layout-root] .ds-footer-link:hover {\n color: var(--brand-primary, #3b82f6);\n transform: translateX(3px);\n }\n\n /* Bottom Utility Bar */\n[data-layout-root] .ds-footer-bottom {\n border-top: 1px solid var(--border-color, rgba(59, 130, 246, 0.15));\n padding-top: 32px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n flex-wrap: wrap;\n gap: 24px;\n }\n\n @media (max-width: 768px) {\n[data-layout-root] .ds-footer-bottom {\n flex-direction: column;\n align-items: flex-start;\n }\n }\n\n[data-layout-root] .ds-footer-copyright {\n font-size: 13px;\n color: var(--text-muted, #6b7280);\n }\n\n /* Dynamic Trust & Security Elements */\n[data-layout-root] .ds-footer-trust-strip {\n display: flex;\n align-items: center;\n gap: 24px;\n }\n\n[data-layout-root] .ds-footer-trust-item {\n display: flex;\n align-items: center;\n gap: 8px;\n font-size: 12px;\n font-weight: 500;\n color: var(--text-muted, #6b7280);\n }\n\n[data-layout-root] .ds-footer-trust-icon {\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: var(--brand-primary, #3b82f6);\n box-shadow: 0 0 6px var(--brand-accent, #60a5fa);\n }\n\n[data-layout-root] .ds-footer-social-strip {\n display: flex;\n gap: 16px;\n }\n\n[data-layout-root] .ds-footer-social-link {\n width: 36px;\n height: 36px;\n border-radius: 50%;\n background: #ffffff;\n border: 1px solid var(--border-color, rgba(59, 130, 246, 0.15));\n display: flex;\n align-items: center;\n justify-content: center;\n transition: all 0.2s ease;\n }\n\n[data-layout-root] .ds-footer-social-link:hover {\n border-color: var(--brand-primary, #3b82f6);\n transform: translateY(-2px);\n }\n\n[data-layout-root] .ds-footer-social-link svg {\n width: 16px;\n height: 16px;\n fill: var(--text-muted, #6b7280);\n transition: fill 0.2s ease;\n }\n\n[data-layout-root] .ds-footer-social-link:hover svg {\n fill: var(--brand-primary, #3b82f6);\n }\n\n/* === Header safety rules (post-processed, not AI-generated) === */\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"cart\"],\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"search\"],\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"login\"],\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"currency\"],\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"mobile-menu\"] {\n flex-shrink: 0 !important;\n min-width: fit-content !important;\n}\n[data-layout-root] [data-layout-root] .global-header [data-slot=\"nav\"] {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n min-width: 0;\n}\n[data-layout-root] [data-layout-root] .global-header {\n max-height: 120px;\n}\n/* Line-height safety \u2014 prevent AI from setting tiny line-heights globally */\n[data-layout-root] [data-layout-root] {\n line-height: 1.5;\n}\n[data-layout-root] [data-layout-root] h1, [data-layout-root] h2, [data-layout-root] h3,\n[data-layout-root] [data-layout-root] h4, [data-layout-root] h5, [data-layout-root] h6 {\n line-height: 1.2;\n}\n[data-layout-root] [data-layout-root] p, [data-layout-root] li, [data-layout-root] span,\n[data-layout-root] [data-layout-root] a, [data-layout-root] label {\n line-height: inherit;\n}\n/* \u2500\u2500 Contrast safety (light theme) \u2500\u2500 */\n/* Product page slots \u2014 often left unstyled by the AI */\n[data-layout-root] [data-layout-root] .slot-title,\n[data-layout-root] [data-layout-root] .slot-title h1,\n[data-layout-root] [data-layout-root] .slot-title .slot-product-name {\n color: var(--theme-ink, var(--ink, #111111));\n}\n[data-layout-root] [data-layout-root] .slot-price,\n[data-layout-root] [data-layout-root] .slot-price .slot-price-amount {\n color: var(--theme-ink, var(--ink, #111111));\n}\n[data-layout-root] [data-layout-root] .slot-description,\n[data-layout-root] [data-layout-root] .slot-description p {\n color: var(--ink-muted, #4a4a4a);\n}\n[data-layout-root] [data-layout-root] .slot-variant-label {\n color: var(--ink-muted, #4a4a4a);\n}\n[data-layout-root] [data-layout-root] .slot-variant-btn {\n color: var(--theme-ink, var(--ink, #111111));\n border-color: rgba(0,0,0,0.08);\n}\n/* Common generated marketing sections */\n[data-layout-root] [data-layout-root] .feature-title,\n[data-layout-root] [data-layout-root] .feature-name,\n[data-layout-root] [data-layout-root] .editorial-title,\n[data-layout-root] [data-layout-root] .trust-value,\n[data-layout-root] [data-layout-root] .hero-price,\n[data-layout-root] [data-layout-root] .feature-content,\n[data-layout-root] [data-layout-root] .feature-content h1,\n[data-layout-root] [data-layout-root] .feature-content h2,\n[data-layout-root] [data-layout-root] .feature-content h3,\n[data-layout-root] [data-layout-root] .feature-content h4,\n[data-layout-root] [data-layout-root] [data-slot=\"logo\"],\n[data-layout-root] [data-layout-root] [data-slot=\"logo\"] *,\n[data-layout-root] [data-layout-root] [data-slot=\"nav\"],\n[data-layout-root] [data-layout-root] [data-slot=\"nav\"] a,\n[data-layout-root] [data-layout-root] .action-icon {\n color: var(--theme-ink, var(--ink, #111111));\n}\n[data-layout-root] [data-layout-root] .trust-label,\n[data-layout-root] [data-layout-root] .feature-tag,\n[data-layout-root] [data-layout-root] .feature-description,\n[data-layout-root] [data-layout-root] .detail-item p,\n[data-layout-root] [data-layout-root] .trust-item p,\n[data-layout-root] [data-layout-root] .feature-action {\n color: var(--ink-muted, #4a4a4a);\n}\n/* Icon / SVG contrast */\n[data-layout-root] [data-layout-root] svg {\n fill: currentColor;\n}\n\n[data-layout-root] [class*=\"grid\"] > *, [data-layout-root] [class*=\"layout\"] > * { min-width: 0; min-height: 0; }\n\n[data-layout-root] .v8-support-panel { color: var(--surface-ink); --ink-muted: var(--surface-ink-muted); }\n\n:root, [data-layout-root] { --surface-ink: #111827; --surface-ink-muted: #4B5563; }\n\n/* Visual QA auto-fixes */\n@media (max-width: 640px) {\n .product-form__input--color {\n display: flex; /* Align color variant options in a flexible, wrapping row with tighter gaps on mobile screens. */\n gap: 8px; /* Reduce the gap between color swatches on mobile to prevent excessive wrapping. */\n }\n .sonic-energy-output__meter {\n max-width: 100%; /* Ensure the frequency meter visualization scales fluidly within mobile viewports without clipping. */\n }\n}\n","globalHtml":"","fonts":["Plus Jakarta Sans","Syne"],"animations":[],"theme":{"mode":"light","palette":{"primary":"#0f172a","secondary":"#090d18","accent":"#0f172a","success":"#0f172a"},"surfaces":{"bg":"#f5f5f6","bgElevated":"#FFFFFF","surface":"#ebeced","surfaceAlt":"#edeeee","ink":"#111827","inkMuted":"#6B7280","border":"#cfd0d4","surfaceInk":"#111827","surfaceInkMuted":"#4B5563"},"typography":{"headingFont":"var(--font-heading)","bodyFont":"var(--font-body)"},"tone":"modern","density":"normal","motion":2,"stylePack":"kinetic-minimalism","surface":"flat","radius":12},"header":{"html":"","css":""},"footer":{"html":"","css":""},"pages":{"home":{"sections":[{"id":"home-main","type":"home_main","html":"

\n \n \n

\n \n

\n\n

\n \n \n

\n \n {{products.[0].name}}\n

\n\n \n

\n The Kinetic Symphony of Pure Clean.\n

\n\n

\n Brushing never looked this good. Combining three intelligent cleaning modes, the Hismile Electric Toothbrush will provide you with a powerful and effective clean.\n

\n\n \n

\n Gentle\n Low Freq\n

A lazy, soothing swell perfectly tuned for sensitive gums and light daily polish.

\n\n

\n Everyday\n Medium\n

The perfect rhythmic balance for comprehensive regular dental maintenance.

\n\n

\n Intense\n High Freq\n

A powerful, high-speed micro-vibration designed for deepest cleaning.

\n\n

\n \n Explore the Collection\n \n

\n\n \n

\n \n \n

\n\n \n

\n $\"\"$ \n

\n\n

\n\n\n\n

\n \n \n

\n \n

Free Express Shipping

Dispatched within 24 hours with premium local tracking.

\n\n \n

\n \n

80-Day Guarantee

Love your clean or return your brush with no questions asked.

\n\n \n

\n \n

2-Year Dental Warranty

Engineered for long-term sonic integrity and battery stamina.

\n\n

\n\n\n

\n \n

\n \n Clinical Architecture\n

Designed to Look Beautiful. Engineered to Clean Deeper.

A seamless convergence of modern vanity aesthetic and medical-grade sonic calibration, bringing raw, effective power directly to your daily routine.

\n\n

\n \n \n

\n \n

\n 01\n

Three Intelligent Micro-Modes

Alternate fluidly between Gentle, Everyday, and Intense vibration modes. Programmed dynamically to respond to standard dental pressures without enamel fatigue.

\n\n

\n 02\n

Memory Smart-Timer

Features an automated 2-minute run cycle with rhythmic 30-second localized quadrant reminders, ensuring a structurally complete diagnostic clean.

\n\n

\n 03\n

Vanity-First Ergonomics

A smooth, ultra-hygienic matte-white outer shell engineered to repel water stains while nesting effortlessly within the modern minimalist bathroom aesthetic.

\n\n

\n\n \n

\n {{#if homeVisuals.[0]}}\n $\"{{homeVisuals.[0].alt}}\"$ \n {{else}}\n $\"{{products.[0].name}}\"$ \n {{/if}}\n

\n Visual Proof\n

Premium Dental Care

\n\n

\n\n \n \n\n

","css":"","dataBindings":{"shop":{"source":"storefront","query":"shopInfo"},"homeVisuals":{"source":"static","value":[{"url":"https://images.unsplash.com/photo-1773867567780-ab81d4a22eef?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w4OTM0MjR8MHwxfHNlYXJjaHwxMHx8bWluaW1hbGlzdCUyMGJhdGhyb29tJTIwdmFuaXR5fGVufDF8MHx8fDE3ODM5MTM2ODh8MA&ixlib=rb-4.1.0&q=80&w=1080","alt":"Dev minimalist","theme":"minimalist","query":"minimalist bathroom vanity","source":"unsplash","photographer":"Franco Debartolo","photographerUrl":"https://unsplash.com/@francotheshooter","role":"campaign","cropHint":"wide-or-art-directed","fitHint":"cover","mobileTreatment":"reframe around the primary subject"},{"url":"https://images.unsplash.com/photo-1632500029279-9b2820e48858?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w4OTM0MjR8MHwxfHNlYXJjaHw1fHxlbGVnYW50JTIwbW9ybmluZyUyMHJvdXRpbmV8ZW58MXwwfHx8MTc4MzkxMzgzN3ww&ixlib=rb-4.1.0&q=80&w=1080","alt":"Dev elegant","theme":"elegant","query":"elegant morning routine","source":"unsplash","photographer":"Jas Min","photographerUrl":"https://unsplash.com/@filmbetrachterin","role":"lifestyle","cropHint":"subject-safe","fitHint":"cover","mobileTreatment":"preserve the principal subject and avoid text collisions"},{"url":"https://images.unsplash.com/photo-1629909613654-28e377c37b09?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w4OTM0MjR8MHwxfHNlYXJjaHwzfHxhZXN0aGV0aWMlMjBkZW50YWwlMjBjYXJlfGVufDF8MHx8fDE3ODM5MTM4MzZ8MA&ixlib=rb-4.1.0&q=80&w=1080","alt":"Dev aesthetic","theme":"aesthetic","query":"aesthetic dental care","source":"unsplash","photographer":"Benyamin Bohlouli","photographerUrl":"https://unsplash.com/@benyamin_bohlouli","role":"detail","cropHint":"close-or-medium","fitHint":"contain-or-cover","mobileTreatment":"preserve the principal subject and avoid text collisions"}]},"products":{"source":"storefront","query":"productList","limit":4},"collections":{"source":"storefront","query":"collectionList","limit":4}}}]},"product":{"sections":[{"id":"product-detail","type":"product_detail","html":"

\n \n

\n {{PRODUCT.CATEGORY}} / {{PRODUCT.NAME}}\n

\n\n \n

\n \n \n

\n \n

\n\n \n

\n Sonic Energy Output\n Adaptive Frequency\n

\n\n \n

\n \n \n

\n Premium Dental Care\n

\n\n \n \n\n \n

\n \n

\n\n

\n\n \n

\n\n

\n\n \n

\u21ba

\n Never Lose Dynamic Power\n

\n Prompt dynamic care at checkout. Subscribe to recurring replacement brush head deliveries every 3 months and save 15% on refill packs.\n

\n\n \n

\u26a1

Free Courier Delivery

Ships next business day with tracked delivery.

\u2713

2-Year Warranty

Full mechanical coverage & easy replacement.

\n\n

\n\n \n

\n Intelligent Tuning\n

Three Precision Speeds

\n High Frequency\n

Clean Mode

Deep cleaning tailored for pristine plaque extraction and daily freshness. Removes maximum build-up.

\n Polishing Wave\n

White Mode

Rapid speed fluctuation cycles engineered to lift micro-stains and deliver high-contrast enamel brightness.

\n Micro-Pulse\n

Sensitive Mode

Gentle sonic feedback ensuring soft tissue defense while preserving deep structural cleanliness.

","css":""}]},"collection":{"sections":[]}},"generationIntent":{"referenceMode":"custom","designMode":"An interactive kinetic symphony where e...","density":"medium","homeSectionCount":3,"openingSectionType":"product-showcase","openingSectionGoal":"An interactive kinetic symphony where every layout shift and background shimmer is triggered by the rhythmic frequencies of the three intelligent cleaning modes.","headerPattern":"a-minimal-translucent-bar-conta...","copyTone":"Rhythmic, precise, and sensory-driven.","imageStrategy":"Ultra-macro, high-speed photography of water droplets exploding off the brush head in mid-vibration.","compositionStrategy":{"opening_relationship":"The storefront behaves like a physical soundwave. As the user scrolls, the background hums with subtle, localized wave ripples that change tempo depending on which of the three cleaning modes is currently highlighted in...","reading_path":"An interactive kinetic symphony where every layout shift and background shimmer is triggered by the rhythmic frequencies of the three intelligent cleaning modes.","product_presentation":"Ultra-macro, high-speed photography of water droplets exploding off the brush head in mid-vibration."},"motionDirection":{"mode":"expressive","purpose":"Hovering over the three mode selectors changes the global scroll-resistance and causes the product image to vibrate at corresponding high-speed micro-frequencies.","techniques":["Hovering over the three mode selectors changes the global scroll-resistance and causes the product image to vibrate at..."],"reduced_motion":"Preserve the final composition without animation"},"headerStrategy":{"structure":"A minimal, translucent bar containing a live 'frequency meter' that mimics the user's scroll speed.","mobile_behavior":"Keep search, account, language, cart, and menu reachable"},"imageAssetPlan":{"primary_role":"Ultra-macro, high-speed photography of water droplets exploding off the brush head in mid-vibration.","mobile_treatment":"Recompose without cropping away the product"},"productPageExtras":["shipping_delivery","trust highlights"],"homePageRules":["This is a single-product store \u2014 the entire homepage must orbit around selling this one product.","Do NOT show category launchers, collection grids, or multi-product browsing sections.","The hero MUST feature the product prominently \u2014 not a generic lifestyle banner.","Use sections for features, benefits, testimonials, brand story, and trust \u2014 but always tie back to the product."]},"generationPlan":{"header":{"pattern":"commerce-search","notes":["Create a strong retail header with utility/support affordances.","Keep it compact, aligned, and ready for search/cart/login injected slots.","The cart slot (data-slot='cart') MUST be visible on ALL screen sizes."]},"home":{"sectionCount":3,"sections":[{"id":"home-opening","name":"Product hero showcase","purpose":"An interactive kinetic symphony where every layout shift and background shimmer is triggered by the rhythmic frequencies of the three intelligent cleaning modes.","layout":"product-showcase","bindings":["products","homeVisuals","hero"]},{"id":"home-trust","name":"Trust strip","purpose":"Highlight delivery, quality, warranty, or value props.","layout":"compact icon/value row","bindings":["shop"]},{"id":"home-features","name":"Product features / benefits","purpose":"Showcase 3-4 key features of the product with icons and concise descriptions.","layout":"feature grid or alternating image-text rows","bindings":["products","homeVisuals"]}]},"product":{"notes":["Honor the required product slot order.","Include shipping/delivery details below the main hero when requested."]},"collection":{"notes":["Lead with a concise collection banner and then a real product grid."]},"footer":{"notes":["Footer should feel useful and commercially complete, not decorative only."]}}}

\n The Kinetic Symphony of Pure Clean.\n

Free Express Shipping

80-Day Guarantee

2-Year Dental Warranty

Designed to Look Beautiful. Engineered to Clean Deeper.

Three Intelligent Micro-Modes

Memory Smart-Timer

Vanity-First Ergonomics

Premium Dental Care

Never run dry: Recurring Brush Head Delivery

Three Precision Speeds

Clean Mode

White Mode

Sensitive Mode