{"project":{"id":"4sJMW5N","userId":"davidyarham@gmail.com","username":null,"userPicture":null,"name":"Voltra Energy Landing Page","visible":true,"contributors":"","githubRepo":null,"forkedFrom":null,"isTemplate":false,"tags":"","files":{"folder":"","files":[{"name":"index.html","content":"\n\n\n \n \n Untitled\n \n\n\n\n\n\n\n\n\n
\n\tHow it works\n\tSavings\n\tSpecs\n\tPre-order — $89\n
\n\n
\n\t
\n\t\t

Your electricity bill, decoded

\n\t\t

See exactly where
your money goes —
watt by watt.

\n\t\t

Voltra clips onto your breaker panel in 10 minutes. No electrician needed. Identifies every\n\t\t\tappliance and shows you what each one costs — live.

\n\t\t
\n\t\t\tPre-order for $89\n\t\t\tShips March 2025 · Free returns\n\t\t
\n\t\t
\n\t\t\t
\n\t\t\t\t4,712\n\t\t\t\tPre-orders placed\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\t$217/yr\n\t\t\t\tAvg. savings reported\n\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\t4.8 \n\t\t\t\tFrom 893 beta users\n\t\t\t
\n\t\t
\n\t
\n\t
\n\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\t\n\t\t\t\t\n\t\t\t\t
\n\t\t\t\t\t2.4\n\t\t\t\t\tkW\n\t\t\t\t\tRight now\n\t\t\t\t
\n\t\t\t
\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\tHVAC\n\t\t\t\t\t1.1 kW\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\tWater heater\n\t\t\t\t\t0.8 kW\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\tKitchen\n\t\t\t\t\t0.3 kW\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\t\t\t\t\tOther\n\t\t\t\t\t0.2 kW\n\t\t\t\t
\n\t\t\t
\n\t\t
\n\t
\n
\n\n
\n\t
\n\t\t

Your utility bill shows one number.
Voltra shows you hundreds.

\n\t\t

Most homes waste 20–35% of their electricity without knowing it. Voltra uses machine learning\n\t\t\tto disaggregate your total power draw into individual appliances — no smart plugs required.

\n\t\t
\n\t\t\t
\n\t\t\t\t
1
\n\t\t\t\t

Clip it on

\n\t\t\t\t

Voltra attaches to your breaker panel with two CT clamps. 10-minute install, no tools beyond a screwdriver.\n\t\t\t\t

\n\t\t\t
\n\t\t\t
\n\t\t\t\t
2
\n\t\t\t\t

It learns your home

\n\t\t\t\t

Over 48 hours, Voltra's ML model identifies the electrical signature of every appliance — fridge, dryer, EV\n\t\t\t\t\tcharger, all of them.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t
3
\n\t\t\t\t

See what's costing you

\n\t\t\t\t

Open the app. See live cost per appliance. Get alerts when something draws more than it should — like an\n\t\t\t\t\taging AC compressor.

\n\t\t\t
\n\t\t
\n\t
\n
\n\n
\n\t
\n\t\t

Beta users saved an average of $217 per year.

\n\t\t

Here's how three households found their biggest energy drains.

\n\t\t
\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t Austin, TX\n\t\t\t\t\tSaved $31/mo\n\t\t\t\t
\n\t\t\t\t

Discovered their 12-year-old fridge was cycling 3x more than normal. Replaced it — payback in 5 months.

\n\t\t\t\tAppliance: Refrigerator\n\t\t\t
\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t Portland, OR\n\t\t\t\t\tSaved $22/mo\n\t\t\t\t
\n\t\t\t\t

Found their EV was charging during peak rate hours. Shifted to off-peak with a simple schedule change.

\n\t\t\t\tAppliance: EV Charger\n\t\t\t
\n\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t Denver, CO\n\t\t\t\t\tSaved $18/mo\n\t\t\t\t
\n\t\t\t\t

Basement dehumidifier was running 24/7 due to a stuck relay. Voltra flagged the abnormal draw within a day.\n\t\t\t\t

\n\t\t\t\tAppliance: Dehumidifier\n\t\t\t
\n\t\t
\n\t
\n
\n\n
\n\t
\n\t\t

What's in the box

\n\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

ESP32-S3 processor

\n\t\t\t\t

Runs ML inference on-device. Your data stays in your home.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

Wi-Fi 6 built in

\n\t\t\t\t

Connects to your network. Streams data to the Voltra app in real time.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

200A capacity

\n\t\t\t\t

Works with standard residential panels up to 200A service.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

UL-listed

\n\t\t\t\t

Certified safe for permanent installation. No exposed wiring.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

iOS & Android app

\n\t\t\t\t

Real-time dashboard, alerts, historical trends, and export to CSV.

\n\t\t\t
\n\t\t\t
\n\t\t\t\t\n\t\t\t\t

Privacy first

\n\t\t\t\t

All processing on-device. We never see your usage data. Period.

\n\t\t\t
\n\t\t
\n\t
\n
\n\n
\n\t
\n\t\t

Stop guessing. Start saving.

\n\t\t

Pre-order Voltra today. 30-day money-back guarantee, no questions asked.

\n\t\tPre-order — $89\n\t\tFree shipping in the US · Ships March 2025\n\t
\n
\n\n\n \n\n"},{"name":"main.js","content":"// Mobile menu toggle\nconst toggle = document.querySelector('.mobile-toggle');\nconst mobileMenu = document.querySelector('.mobile-menu');\n\ntoggle.addEventListener('click', () => {\n\tmobileMenu.classList.toggle('open');\n\tconst isOpen = mobileMenu.classList.contains('open');\n\ttoggle.innerHTML = isOpen ?\n\t\t'' :\n\t\t'';\n\tlucide.createIcons();\n});\n\n// Close mobile menu on link click\nmobileMenu.querySelectorAll('a').forEach(link => {\n\tlink.addEventListener('click', () => {\n\t\tmobileMenu.classList.remove('open');\n\t\ttoggle.innerHTML = '';\n\t\tlucide.createIcons();\n\t});\n});\n\n// Animate energy meter ring on scroll\nconst ringFill = document.querySelector('.ring-fill');\nconst observer = new IntersectionObserver((entries) => {\n\tentries.forEach(entry => {\n\t\tif (entry.isIntersecting) {\n\t\t\tringFill.classList.add('animated');\n\t\t}\n\t});\n}, {\n\tthreshold: 0.3\n});\n\nobserver.observe(document.querySelector('.energy-meter'));\n\n// Animate meter value counting up\nconst meterValue = document.querySelector('.meter-value');\nlet counted = false;\n\nconst countObserver = new IntersectionObserver((entries) => {\n\tentries.forEach(entry => {\n\t\tif (entry.isIntersecting && !counted) {\n\t\t\tcounted = true;\n\t\t\tlet current = 0;\n\t\t\tconst target = 2.4;\n\t\t\tconst duration = 1500;\n\t\t\tconst start = performance.now();\n\n\t\t\tfunction animate(now) {\n\t\t\t\tconst elapsed = now - start;\n\t\t\t\tconst progress = Math.min(elapsed / duration, 1);\n\t\t\t\t// Ease out cubic\n\t\t\t\tconst eased = 1 - Math.pow(1 - progress, 3);\n\t\t\t\tcurrent = eased * target;\n\t\t\t\tmeterValue.textContent = current.toFixed(1);\n\t\t\t\tif (progress < 1) requestAnimationFrame(animate);\n\t\t\t}\n\t\t\trequestAnimationFrame(animate);\n\t\t}\n\t});\n}, {\n\tthreshold: 0.3\n});\n\ncountObserver.observe(document.querySelector('.energy-meter'));\n\n// Smooth reveal animations\nconst revealElements = document.querySelectorAll('.step, .case-card, .spec-item');\n\nrevealElements.forEach((el, i) => {\n\tel.style.opacity = '0';\n\tel.style.transform = 'translateY(24px)';\n\tel.style.transition = `opacity 0.5s ease ${i % 3 * 0.1}s, transform 0.5s ease ${i % 3 * 0.1}s`;\n});\n\nconst revealObserver = new IntersectionObserver((entries) => {\n\tentries.forEach(entry => {\n\t\tif (entry.isIntersecting) {\n\t\t\tentry.target.style.opacity = '1';\n\t\t\tentry.target.style.transform = 'translateY(0)';\n\t\t}\n\t});\n}, {\n\tthreshold: 0.1\n});\n\nrevealElements.forEach(el => revealObserver.observe(el));\n\n// Init Lucide icons\nlucide.createIcons();"},{"name":"style.css","content":":root {\n\tcolor-scheme: light;\n\tfont-family: 'Inter', system-ui, -apple-system, sans-serif;\n\t--green-950: #052e16;\n\t--green-900: #14532d;\n\t--green-800: #166534;\n\t--green-700: #15803d;\n\t--green-600: #16a34a;\n\t--green-100: #dcfce7;\n\t--green-50: #f0fdf4;\n\t--amber-500: #f59e0b;\n\t--amber-400: #fbbf24;\n\t--amber-600: #d97706;\n\t--neutral-50: #fafafa;\n\t--neutral-100: #f5f5f5;\n\t--neutral-200: #e5e5e5;\n\t--neutral-400: #a3a3a3;\n\t--neutral-600: #525252;\n\t--neutral-700: #404040;\n\t--neutral-800: #262626;\n\t--neutral-900: #171717;\n\t--radius: 10px;\n\t--max-width: 1140px;\n}\n\n* {\n\tbox-sizing: border-box;\n\tmargin: 0;\n\tpadding: 0;\n}\n\nhtml {\n\tscroll-behavior: smooth;\n}\n\nbody {\n\tbackground: #fff;\n\tcolor: var(--neutral-800);\n\tline-height: 1.6;\n\t-webkit-font-smoothing: antialiased;\n}\n\na {\n\tcolor: inherit;\n\ttext-decoration: none;\n}\n\nimg {\n\tmax-width: 100%;\n}\n\n/* ---- NAV ---- */\n.nav {\n\tposition: fixed;\n\ttop: 0;\n\tleft: 0;\n\tright: 0;\n\tz-index: 100;\n\tbackground: rgba(255, 255, 255, 0.92);\n\tbackdrop-filter: blur(12px);\n\tborder-bottom: 1px solid var(--neutral-200);\n}\n\n.nav-inner {\n\tmax-width: var(--max-width);\n\tmargin: 0 auto;\n\tpadding: 0 24px;\n\theight: 64px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: space-between;\n}\n\n.logo {\n\tfont-weight: 800;\n\tfont-size: 1.25rem;\n\tcolor: var(--green-800);\n\tletter-spacing: -0.02em;\n}\n\n.nav-links {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 32px;\n\tfont-size: 0.9rem;\n\tcolor: var(--neutral-600);\n}\n\n.nav-links a:hover {\n\tcolor: var(--green-800);\n}\n\n.mobile-toggle {\n\tdisplay: none;\n\tbackground: none;\n\tborder: none;\n\tcursor: pointer;\n\tcolor: var(--neutral-700);\n}\n\n.mobile-menu {\n\tdisplay: none;\n\tposition: fixed;\n\ttop: 64px;\n\tleft: 0;\n\tright: 0;\n\tz-index: 99;\n\tbackground: #fff;\n\tborder-bottom: 1px solid var(--neutral-200);\n\tpadding: 16px 24px;\n\tflex-direction: column;\n\tgap: 16px;\n\tfont-size: 1rem;\n}\n\n.mobile-menu.open {\n\tdisplay: flex;\n}\n\n/* ---- BUTTONS ---- */\n.btn {\n\tdisplay: inline-flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--green-800);\n\tcolor: #fff;\n\tfont-weight: 600;\n\tfont-size: 0.95rem;\n\tpadding: 10px 22px;\n\tborder-radius: var(--radius);\n\tborder: none;\n\tcursor: pointer;\n\ttransition: background 0.2s, transform 0.15s;\n}\n\n.btn:hover {\n\tbackground: var(--green-700);\n\ttransform: translateY(-1px);\n}\n\n.btn:active {\n\ttransform: translateY(0);\n}\n\n.btn-sm {\n\tpadding: 8px 18px;\n\tfont-size: 0.85rem;\n}\n\n.btn-lg {\n\tpadding: 14px 32px;\n\tfont-size: 1.1rem;\n}\n\n.btn-cta {\n\tbackground: var(--amber-500);\n\tcolor: var(--green-950);\n\tfont-size: 1.15rem;\n\tpadding: 16px 40px;\n}\n\n.btn-cta:hover {\n\tbackground: var(--amber-400);\n}\n\n/* ---- HERO ---- */\n.hero {\n\tmax-width: var(--max-width);\n\tmargin: 0 auto;\n\tpadding: 120px 24px 80px;\n\tdisplay: grid;\n\tgrid-template-columns: 1.1fr 0.9fr;\n\tgap: 60px;\n\talign-items: center;\n}\n\n.hero-tag {\n\tfont-size: 0.85rem;\n\tfont-weight: 600;\n\ttext-transform: uppercase;\n\tletter-spacing: 0.08em;\n\tcolor: var(--green-700);\n\tmargin-bottom: 16px;\n}\n\n.hero h1 {\n\tfont-size: clamp(2.2rem, 5vw, 3.5rem);\n\tfont-weight: 800;\n\tline-height: 1.12;\n\tletter-spacing: -0.03em;\n\tcolor: var(--green-950);\n\tmargin-bottom: 20px;\n}\n\n.highlight {\n\tcolor: var(--amber-600);\n}\n\n.hero-sub {\n\tfont-size: 1.1rem;\n\tcolor: var(--neutral-600);\n\tmax-width: 520px;\n\tline-height: 1.7;\n\tmargin-bottom: 32px;\n}\n\n.hero-actions {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 16px;\n\tflex-wrap: wrap;\n\tmargin-bottom: 48px;\n}\n\n.hero-note {\n\tfont-size: 0.82rem;\n\tcolor: var(--neutral-400);\n}\n\n.proof-bar {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 24px;\n\tpadding-top: 32px;\n\tborder-top: 1px solid var(--neutral-200);\n}\n\n.proof-stat strong {\n\tdisplay: block;\n\tfont-size: 1.25rem;\n\tfont-weight: 800;\n\tcolor: var(--green-900);\n}\n\n.proof-stat span {\n\tfont-size: 0.8rem;\n\tcolor: var(--neutral-400);\n}\n\n.proof-stat strong {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n}\n\n.star-icon {\n\twidth: 16px;\n\theight: 16px;\n\tcolor: var(--amber-500);\n\tfill: var(--amber-500);\n}\n\n.proof-divider {\n\twidth: 1px;\n\theight: 36px;\n\tbackground: var(--neutral-200);\n}\n\n/* ---- ENERGY METER ---- */\n.hero-visual {\n\tdisplay: flex;\n\tjustify-content: center;\n}\n\n.energy-meter {\n\tbackground: var(--green-50);\n\tborder: 1px solid var(--green-100);\n\tborder-radius: 20px;\n\tpadding: 36px;\n\twidth: 100%;\n\tmax-width: 380px;\n}\n\n.meter-ring {\n\tposition: relative;\n\twidth: 180px;\n\theight: 180px;\n\tmargin: 0 auto 28px;\n}\n\n.meter-ring svg {\n\twidth: 100%;\n\theight: 100%;\n\ttransform: rotate(-90deg);\n}\n\n.ring-bg {\n\tfill: none;\n\tstroke: var(--neutral-200);\n\tstroke-width: 10;\n}\n\n.ring-fill {\n\tfill: none;\n\tstroke: var(--green-600);\n\tstroke-width: 10;\n\tstroke-linecap: round;\n\tstroke-dasharray: 534;\n\tstroke-dashoffset: 534;\n\ttransition: stroke-dashoffset 1.5s ease;\n}\n\n.ring-fill.animated {\n\tstroke-dashoffset: 214;\n}\n\n.meter-center {\n\tposition: absolute;\n\tinset: 0;\n\tdisplay: flex;\n\tflex-direction: column;\n\talign-items: center;\n\tjustify-content: center;\n}\n\n.meter-value {\n\tfont-size: 2.8rem;\n\tfont-weight: 800;\n\tcolor: var(--green-900);\n\tline-height: 1;\n\tletter-spacing: -0.03em;\n}\n\n.meter-unit {\n\tfont-size: 0.95rem;\n\tfont-weight: 600;\n\tcolor: var(--green-700);\n}\n\n.meter-label {\n\tfont-size: 0.75rem;\n\tcolor: var(--neutral-400);\n\tmargin-top: 4px;\n}\n\n.meter-breakdown {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: 10px;\n}\n\n.breakdown-item {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 10px;\n\tfont-size: 0.88rem;\n}\n\n.dot {\n\twidth: 10px;\n\theight: 10px;\n\tborder-radius: 50%;\n\tflex-shrink: 0;\n}\n\n.dot-1 {\n\tbackground: var(--green-600);\n}\n\n.dot-2 {\n\tbackground: var(--green-700);\n}\n\n.dot-3 {\n\tbackground: var(--amber-500);\n}\n\n.dot-4 {\n\tbackground: var(--neutral-400);\n}\n\n.breakdown-name {\n\tflex: 1;\n\tcolor: var(--neutral-600);\n}\n\n.breakdown-val {\n\tfont-weight: 600;\n\tcolor: var(--neutral-800);\n}\n\n/* ---- PROBLEM / HOW IT WORKS ---- */\n.problem {\n\tbackground: var(--green-950);\n\tcolor: #fff;\n\tpadding: 100px 24px;\n}\n\n.section-inner {\n\tmax-width: var(--max-width);\n\tmargin: 0 auto;\n}\n\n.problem h2 {\n\tfont-size: clamp(1.6rem, 3.5vw, 2.4rem);\n\tfont-weight: 800;\n\tline-height: 1.2;\n\tletter-spacing: -0.02em;\n\tmargin-bottom: 16px;\n}\n\n.problem h2 em {\n\tfont-style: normal;\n\tcolor: var(--amber-400);\n}\n\n.problem-sub {\n\tfont-size: 1.05rem;\n\tcolor: rgba(255, 255, 255, 0.65);\n\tmax-width: 620px;\n\tmargin-bottom: 56px;\n\tline-height: 1.7;\n}\n\n.steps {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(3, 1fr);\n\tgap: 40px;\n}\n\n.step {\n\tpadding: 32px;\n\tbackground: rgba(255, 255, 255, 0.06);\n\tborder-radius: var(--radius);\n\tborder: 1px solid rgba(255, 255, 255, 0.1);\n}\n\n.step-num {\n\twidth: 36px;\n\theight: 36px;\n\tdisplay: flex;\n\talign-items: center;\n\tjustify-content: center;\n\tbackground: var(--amber-500);\n\tcolor: var(--green-950);\n\tfont-weight: 800;\n\tfont-size: 0.9rem;\n\tborder-radius: 50%;\n\tmargin-bottom: 20px;\n}\n\n.step h3 {\n\tfont-size: 1.15rem;\n\tfont-weight: 700;\n\tmargin-bottom: 10px;\n}\n\n.step p {\n\tfont-size: 0.92rem;\n\tcolor: rgba(255, 255, 255, 0.6);\n\tline-height: 1.65;\n}\n\n/* ---- SAVINGS / CASE STUDIES ---- */\n.savings {\n\tpadding: 100px 24px;\n\tbackground: var(--neutral-50);\n}\n\n.savings h2 {\n\tfont-size: clamp(1.6rem, 3.5vw, 2.4rem);\n\tfont-weight: 800;\n\tline-height: 1.2;\n\tletter-spacing: -0.02em;\n\tmargin-bottom: 8px;\n}\n\n.savings-sub {\n\tfont-size: 1.05rem;\n\tcolor: var(--neutral-600);\n\tmargin-bottom: 48px;\n}\n\n.case-cards {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(3, 1fr);\n\tgap: 24px;\n}\n\n.case-card {\n\tbackground: #fff;\n\tborder: 1px solid var(--neutral-200);\n\tborder-radius: var(--radius);\n\tpadding: 28px;\n\ttransition: box-shadow 0.2s;\n}\n\n.case-card:hover {\n\tbox-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);\n}\n\n.case-header {\n\tdisplay: flex;\n\tjustify-content: space-between;\n\talign-items: center;\n\tmargin-bottom: 14px;\n\tfont-size: 0.85rem;\n}\n\n.case-location {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 4px;\n\tcolor: var(--neutral-400);\n}\n\n.case-location svg {\n\twidth: 14px;\n\theight: 14px;\n}\n\n.case-saving {\n\tfont-weight: 700;\n\tcolor: var(--green-700);\n}\n\n.case-card p {\n\tfont-size: 0.95rem;\n\tcolor: var(--neutral-700);\n\tline-height: 1.65;\n\tmargin-bottom: 16px;\n}\n\n.case-tag {\n\tfont-size: 0.78rem;\n\tfont-weight: 600;\n\tcolor: var(--neutral-400);\n\ttext-transform: uppercase;\n\tletter-spacing: 0.05em;\n}\n\n/* ---- SPECS ---- */\n.specs {\n\tpadding: 100px 24px;\n}\n\n.specs h2 {\n\tfont-size: clamp(1.6rem, 3.5vw, 2.4rem);\n\tfont-weight: 800;\n\tletter-spacing: -0.02em;\n\tmargin-bottom: 48px;\n}\n\n.specs-grid {\n\tdisplay: grid;\n\tgrid-template-columns: repeat(3, 1fr);\n\tgap: 32px;\n}\n\n.spec-item {\n\tpadding: 28px;\n\tborder: 1px solid var(--neutral-200);\n\tborder-radius: var(--radius);\n\ttransition: border-color 0.2s;\n}\n\n.spec-item:hover {\n\tborder-color: var(--green-600);\n}\n\n.spec-item svg {\n\twidth: 24px;\n\theight: 24px;\n\tcolor: var(--green-700);\n\tmargin-bottom: 16px;\n}\n\n.spec-item h3 {\n\tfont-size: 1rem;\n\tfont-weight: 700;\n\tmargin-bottom: 6px;\n}\n\n.spec-item p {\n\tfont-size: 0.88rem;\n\tcolor: var(--neutral-600);\n\tline-height: 1.6;\n}\n\n/* ---- CTA ---- */\n.cta {\n\tpadding: 100px 24px;\n\tbackground: var(--green-50);\n}\n\n.cta-inner {\n\ttext-align: center;\n}\n\n.cta h2 {\n\tfont-size: clamp(1.8rem, 4vw, 2.8rem);\n\tfont-weight: 800;\n\tletter-spacing: -0.02em;\n\tcolor: var(--green-950);\n\tmargin-bottom: 12px;\n}\n\n.cta p {\n\tfont-size: 1.1rem;\n\tcolor: var(--neutral-600);\n\tmargin-bottom: 32px;\n}\n\n.cta-note {\n\tdisplay: block;\n\tmargin-top: 16px;\n\tfont-size: 0.82rem;\n\tcolor: var(--neutral-400);\n}\n\n/* ---- FOOTER ---- */\n.footer {\n\tpadding: 60px 24px 40px;\n\tborder-top: 1px solid var(--neutral-200);\n}\n\n.footer-inner {\n\tmax-width: var(--max-width);\n\tmargin: 0 auto;\n\tdisplay: flex;\n\talign-items: start;\n\tjustify-content: space-between;\n\tflex-wrap: wrap;\n\tgap: 32px;\n}\n\n.footer-brand p {\n\tfont-size: 0.85rem;\n\tcolor: var(--neutral-400);\n\tmargin-top: 8px;\n}\n\n.footer-links {\n\tdisplay: flex;\n\tgap: 24px;\n\tfont-size: 0.88rem;\n\tcolor: var(--neutral-600);\n}\n\n.footer-links a:hover {\n\tcolor: var(--green-800);\n}\n\n.footer-copy {\n\twidth: 100%;\n\tfont-size: 0.8rem;\n\tcolor: var(--neutral-400);\n\tmargin-top: 24px;\n\tpadding-top: 24px;\n\tborder-top: 1px solid var(--neutral-100);\n}\n\n/* ---- RESPONSIVE ---- */\n@media (max-width: 768px) {\n\t.nav-links {\n\t\tdisplay: none;\n\t}\n\n\t.mobile-toggle {\n\t\tdisplay: block;\n\t}\n\n\t.hero {\n\t\tgrid-template-columns: 1fr;\n\t\tpadding: 100px 20px 60px;\n\t\tgap: 40px;\n\t}\n\n\t.hero h1 br {\n\t\tdisplay: none;\n\t}\n\n\t.proof-bar {\n\t\tflex-wrap: wrap;\n\t\tgap: 16px;\n\t}\n\n\t.proof-divider {\n\t\tdisplay: none;\n\t}\n\n\t.steps,\n\t.case-cards,\n\t.specs-grid {\n\t\tgrid-template-columns: 1fr;\n\t}\n\n\t.problem,\n\t.savings,\n\t.specs,\n\t.cta {\n\t\tpadding: 72px 20px;\n\t}\n\n\t.hide-mobile {\n\t\tdisplay: none;\n\t}\n\n\t.footer-inner {\n\t\tflex-direction: column;\n\t}\n\n\t.footer-links {\n\t\tflex-wrap: wrap;\n\t\tgap: 16px;\n\t}\n}\n\n@media (max-width: 480px) {\n\t.hero h1 {\n\t\tfont-size: 1.8rem;\n\t}\n\n\t.btn-lg {\n\t\twidth: 100%;\n\t\ttext-align: center;\n\t}\n\n\t.btn-cta {\n\t\twidth: 100%;\n\t}\n\n\t.energy-meter {\n\t\tpadding: 24px;\n\t}\n}"}],"folders":[]},"variants":null,"createdAt":"2026-03-07T02:38:15.925Z","updatedAt":"2026-03-07T02:39:00.994Z","hasThumbnail":true}}