{"id":3178,"date":"2026-05-06T17:25:19","date_gmt":"2026-05-06T17:25:19","guid":{"rendered":"https:\/\/auxanosolar.com\/?page_id=3178"},"modified":"2026-05-07T10:16:15","modified_gmt":"2026-05-07T10:16:15","slug":"smart-energy-calculator","status":"publish","type":"page","link":"https:\/\/auxanosolar.com\/?page_id=3178","title":{"rendered":"Energy Audit"},"content":{"rendered":"\t\t
\n\t\t\t\t\t\t\t\t\t
\n\t\t\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t
\n\t\t\t\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\n\n\n\n\nAuxano Solar Smart Load Estimator<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;500;700;900&display=swap\" rel=\"stylesheet\">\n<style>\n\/* ========================================================\n AUXANO SOLAR - SMART LOAD ESTIMATOR\n Mobile-first responsive design\n Colour tokens: #F97316 (brand orange), #1e293b (slate-900)\n ======================================================== *\/\n*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}\n\n#auxano-sle{\n font-family:'Roboto',sans-serif;\n background:#f8fafc;\n color:#1e293b;\n max-width:1100px;\n margin:0 auto;\n padding:0 12px 48px;\n -webkit-text-size-adjust:100%;\n}\n\n\/* ---- progress bar ---- *\/\n.sle-progress{display:flex;align-items:center;justify-content:center;gap:0;padding:20px 8px 28px;position:relative;overflow:hidden}\n.sle-step-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;position:relative;z-index:1;flex-shrink:0}\n.sle-step-dot{width:30px;height:30px;border-radius:50%;border:2.5px solid #e2e8f0;background:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#94a3b8;transition:all .3s}\n.sle-step-wrap.active .sle-step-dot{border-color:#F97316;background:#FFF7F0;color:#F97316}\n.sle-step-wrap.done .sle-step-dot{border-color:#F97316;background:#F97316;color:#fff}\n.sle-step-label{font-size:9px;font-weight:500;color:#94a3b8;text-align:center;max-width:56px;line-height:1.2;display:none}\n.sle-step-wrap.active .sle-step-label{color:#F97316;display:block}\n.sle-step-wrap.done .sle-step-label{color:#64748b}\n.sle-connector-line{flex:1;height:2px;background:#e2e8f0;min-width:8px;transition:background .3s}\n.sle-connector-line.done{background:#F97316}\n\n\/* ---- section header ---- *\/\n.sle-section-header{text-align:center;margin-bottom:20px}\n.sle-section-header h2{font-size:22px;font-weight:700;color:#1e293b;line-height:1.2}\n.sle-section-header p{font-size:14px;color:#64748b;margin-top:6px;max-width:560px;margin-left:auto;margin-right:auto;line-height:1.5}\n.sle-orange{color:#F97316}\n\n\/* ---- category tabs ---- *\/\n.cat-tabs{display:flex;gap:6px;flex-wrap:nowrap;overflow-x:auto;margin-bottom:16px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}\n.cat-tabs::-webkit-scrollbar{display:none}\n.cat-tab{padding:6px 12px;border-radius:20px;border:1.5px solid #e2e8f0;background:#fff;font-size:12px;font-weight:500;color:#64748b;cursor:pointer;transition:all .2s;white-space:nowrap;flex-shrink:0;-webkit-tap-highlight-color:transparent}\n.cat-tab.active{background:#F97316;border-color:#F97316;color:#fff}\n\n\/* ---- appliance grid ---- *\/\n.appliance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:20px}\n.appliance-card{background:#fff;border:2px solid #e2e8f0;border-radius:12px;padding:12px 10px;cursor:pointer;transition:all .2s;text-align:center;position:relative;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}\n.appliance-card.selected{border-color:#F97316;background:#FFF7F0}\n.appliance-card .check-badge{position:absolute;top:7px;right:7px;width:18px;height:18px;border-radius:50%;background:#F97316;display:none;align-items:center;justify-content:center}\n.appliance-card.selected .check-badge{display:flex}\n.appliance-card .check-badge svg{width:10px;height:10px;fill:none;stroke:#fff;stroke-width:2.5}\n.appliance-card .app-icon{font-size:24px;margin-bottom:6px;line-height:1}\n.appliance-card .app-name{font-size:12px;font-weight:600;color:#1e293b;margin-bottom:2px;line-height:1.3}\n.appliance-card .app-watts{font-size:10px;color:#94a3b8;font-weight:400}\n.appliance-card .qty-row{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:8px;opacity:0;pointer-events:none;transition:opacity .2s}\n.appliance-card.selected .qty-row{opacity:1;pointer-events:all}\n.qty-btn{width:26px;height:26px;border-radius:50%;border:1.5px solid #F97316;background:transparent;color:#F97316;font-size:16px;font-weight:700;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1;transition:background .15s;touch-action:manipulation}\n.qty-btn:active{background:#F97316;color:#fff}\n.qty-val{font-size:14px;font-weight:700;color:#1e293b;min-width:20px;text-align:center}\n\n\/* ---- custom appliance ---- *\/\n.custom-add-row{display:flex;flex-direction:column;gap:10px;margin-top:8px;background:#fff;padding:14px;border-radius:10px;border:1.5px dashed #e2e8f0}\n.custom-add-inputs{display:flex;gap:8px;flex-wrap:wrap}\n.custom-add-row input{flex:1;min-width:120px;padding:10px 12px;border:1.5px solid #e2e8f0;border-radius:8px;font-family:'Roboto',sans-serif;font-size:15px;outline:none;transition:border .2s;-webkit-appearance:none}\n.custom-add-row input:focus{border-color:#F97316}\n.custom-add-row button{width:100%;padding:10px 16px;background:#F97316;color:#fff;border:none;border-radius:8px;font-family:'Roboto',sans-serif;font-weight:600;font-size:14px;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.custom-add-row button:active{background:#ea6b0a}\n\n\/* ---- hours slider ---- *\/\n.hours-section{background:#fff;border-radius:12px;border:1.5px solid #e2e8f0;padding:16px;margin-bottom:16px}\n.hours-section h3{font-size:14px;font-weight:600;color:#1e293b;margin-bottom:12px}\n.slider-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;margin-bottom:12px}\n.slider-row label{font-size:12px;color:#64748b;grid-column:1\/-1}\n.slider-row input[type=range]{flex:1;accent-color:#F97316;height:6px;width:100%;cursor:pointer}\n.slider-row .val{font-size:13px;font-weight:700;color:#F97316;min-width:32px;text-align:right}\n\n\/* ---- load summary bar ---- *\/\n.load-summary{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);border-radius:14px;padding:16px;margin-bottom:20px;display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:center}\n.load-summary-divider{display:none}\n.load-stat{text-align:center;padding:8px;background:rgba(255,255,255,.05);border-radius:10px}\n.load-stat .ls-val{font-size:18px;font-weight:800;color:#F97316}\n.load-stat .ls-label{font-size:10px;color:#94a3b8;font-weight:400;margin-top:3px;line-height:1.3}\n\n\/* ---- nav buttons ---- *\/\n.sle-nav{display:flex;gap:10px;justify-content:space-between;margin-top:24px}\n.btn-back{padding:12px 20px;border:2px solid #e2e8f0;border-radius:10px;background:transparent;font-family:'Roboto',sans-serif;font-weight:600;font-size:14px;color:#64748b;cursor:pointer;transition:all .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.btn-back:active{border-color:#94a3b8;color:#1e293b}\n.btn-next{flex:1;padding:13px 20px;background:#F97316;border:none;border-radius:10px;font-family:'Roboto',sans-serif;font-weight:700;font-size:14px;color:#fff;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.btn-next:active{background:#ea6b0a}\n.btn-next:disabled{background:#fed7aa;cursor:not-allowed}\n\n\/* ---- usage profile ---- *\/\n.usage-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}\n.usage-card{background:#fff;border:2px solid #e2e8f0;border-radius:12px;padding:14px 12px;cursor:pointer;transition:all .2s;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.usage-card.selected{border-color:#F97316;background:#FFF7F0}\n.usage-card .uc-icon{font-size:22px;margin-bottom:6px;display:block}\n.usage-card .uc-name{font-size:13px;font-weight:700;color:#1e293b;margin-bottom:3px;line-height:1.3}\n.usage-card .uc-desc{font-size:11px;color:#64748b;line-height:1.4}\n\n\/* ---- form inputs ---- *\/\n.form-section{background:#fff;border-radius:14px;border:1.5px solid #e2e8f0;padding:16px;margin-bottom:16px}\n.form-section h3{font-size:15px;font-weight:700;color:#1e293b;margin-bottom:14px;padding-bottom:10px;border-bottom:1px solid #f1f5f9}\n.form-row{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:12px}\n.form-row.full{grid-template-columns:1fr}\n.form-group{display:flex;flex-direction:column;gap:5px}\n.form-group label{font-size:13px;font-weight:500;color:#475569}\n.form-group input,.form-group select,.form-group textarea{\n padding:12px 14px;border:1.5px solid #e2e8f0;border-radius:8px;\n font-family:'Roboto',sans-serif;font-size:16px;color:#1e293b;\n outline:none;transition:border .2s;background:#fff;\n -webkit-appearance:none;appearance:none;width:100%\n}\n.form-group select{background-image:url(\"data:image\/svg+xml,%3Csvg xmlns='http:\/\/www.w3.org\/2000\/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'\/%3E%3C\/svg%3E\");background-repeat:no-repeat;background-position:right 14px center;padding-right:36px}\n.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:#F97316}\n.form-group textarea{resize:vertical;min-height:80px;font-size:15px}\n.required-star{color:#F97316}\n\n\/* ---- AI Analysis screen ---- *\/\n.ai-analyzing{text-align:center;padding:40px 16px}\n.ai-analyzing .spinner{width:56px;height:56px;border:4px solid #fed7aa;border-top-color:#F97316;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 16px}\n@keyframes spin{to{transform:rotate(360deg)}}\n.ai-analyzing h3{font-size:18px;font-weight:700;color:#1e293b;margin-bottom:6px}\n.ai-analyzing p{color:#64748b;font-size:13px;line-height:1.5}\n.ai-status-steps{list-style:none;margin-top:20px;display:flex;flex-direction:column;gap:8px;text-align:left;max-width:300px;margin-left:auto;margin-right:auto}\n.ai-status-step{display:flex;align-items:center;gap:10px;font-size:13px;color:#94a3b8;padding:8px 12px;border-radius:8px}\n.ai-status-step.done{color:#16a34a;background:#f0fdf4}\n.ai-status-step.active{color:#F97316;background:#FFF7F0;font-weight:600}\n.ai-status-step .step-dot{width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0}\n\n\/* ---- recommendation hero card ---- *\/\n.rec-hero{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%);border-radius:16px;padding:20px 16px;margin-bottom:16px;color:#fff}\n.rec-hero .rh-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(249,115,22,.2);border:1px solid rgba(249,115,22,.4);color:#fdba74;font-size:11px;font-weight:600;padding:4px 12px;border-radius:20px;margin-bottom:12px}\n.rec-hero h2{font-size:20px;font-weight:800;color:#fff;margin-bottom:4px;line-height:1.3}\n.rec-hero .rh-subtitle{font-size:13px;color:#94a3b8;margin-bottom:16px}\n.rec-hero .rh-specs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}\n.rh-spec{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px 8px;text-align:center}\n.rh-spec .spec-val{font-size:15px;font-weight:800;color:#F97316;line-height:1.2}\n.rh-spec .spec-label{font-size:10px;color:#94a3b8;margin-top:3px;line-height:1.3}\n\n\/* ---- rec details ---- *\/\n.rec-details-grid{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:16px}\n.rec-detail-card{background:#fff;border-radius:12px;border:1.5px solid #e2e8f0;padding:16px}\n.rec-detail-card h4{font-size:12px;font-weight:700;color:#F97316;text-transform:uppercase;letter-spacing:.05em;margin-bottom:10px}\n.rec-detail-card ul{list-style:none;display:flex;flex-direction:column;gap:8px}\n.rec-detail-card li{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:#475569;line-height:1.5}\n.rec-detail-card li::before{content:'\u2713';color:#F97316;font-weight:700;margin-top:1px;flex-shrink:0}\n\n\/* ---- cost table ---- *\/\n.cost-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:0}\n.cost-table th{background:#f8fafc;padding:9px 10px;text-align:left;font-size:11px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.04em;border-bottom:2px solid #e2e8f0}\n.cost-table td{padding:10px;border-bottom:1px solid #f1f5f9;color:#1e293b;vertical-align:top}\n.cost-table tr:last-child td{font-weight:700;background:#FFF7F0;color:#F97316}\n\n\/* ---- action bar ---- *\/\n.action-bar{display:flex;flex-direction:column;gap:10px;padding:16px;background:#f8fafc;border-top:1px solid #e2e8f0;border-radius:0 0 14px 14px}\n.btn-action{display:flex;align-items:center;justify-content:center;gap:8px;padding:13px 16px;border-radius:10px;font-family:'Roboto',sans-serif;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;border:2px solid transparent;text-align:center;touch-action:manipulation;-webkit-tap-highlight-color:transparent}\n.btn-primary-action{background:#F97316;color:#fff;border-color:#F97316}\n.btn-primary-action:active{background:#ea6b0a}\n.btn-secondary-action{background:#fff;color:#1e293b;border-color:#e2e8f0}\n.btn-secondary-action:active{border-color:#F97316;color:#F97316}\n\n\/* ---- toast ---- *\/\n.sle-toast{position:fixed;bottom:16px;left:12px;right:12px;background:#1e293b;color:#fff;padding:13px 16px;border-radius:10px;font-size:14px;font-weight:500;z-index:9999;opacity:0;transform:translateY(10px);transition:all .3s;display:flex;align-items:center;gap:10px;box-shadow:0 8px 30px rgba(0,0,0,.2)}\n.sle-toast.show{opacity:1;transform:translateY(0)}\n.sle-toast .toast-icon{color:#F97316;font-size:18px;flex-shrink:0}\n\n\/* ---- email success ---- *\/\n.email-success{text-align:center;padding:36px 16px}\n.email-success .success-circle{width:72px;height:72px;border-radius:50%;background:linear-gradient(135deg,#F97316,#ea6b0a);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}\n.email-success .success-circle svg{width:32px;height:32px;fill:none;stroke:#fff;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}\n.email-success h2{font-size:20px;font-weight:800;color:#1e293b;margin-bottom:8px}\n.email-success p{color:#64748b;font-size:14px;max-width:360px;margin:0 auto 20px;line-height:1.6}\n.email-success-btns{display:flex;flex-direction:column;gap:10px;max-width:320px;margin:0 auto}\n\n\/* ---- misc ---- *\/\n.hidden{display:none!important}\n.divider{height:1px;background:#f1f5f9;margin:16px 0}\n.text-muted{color:#64748b;font-size:13px}\n.mt-8{margin-top:8px}\n.mb-12{margin-bottom:12px}\n.font-bold{font-weight:700}\n.text-orange{color:#F97316}\n\n\/* ================================================\n TABLET \u2014 600px+\n ================================================ *\/\n@media(min-width:600px){\n #auxano-sle{padding:0 20px 60px}\n\n .sle-progress{padding:28px 16px 36px}\n .sle-step-dot{width:34px;height:34px;font-size:13px}\n .sle-step-label{display:block;font-size:10px;max-width:72px}\n .sle-connector-line{min-width:16px;max-width:60px}\n\n .sle-section-header h2{font-size:26px}\n .sle-section-header{margin-bottom:28px}\n\n .appliance-grid{grid-template-columns:repeat(3,1fr);gap:12px}\n .appliance-card{padding:14px 12px}\n .appliance-card .app-icon{font-size:26px}\n .appliance-card .app-name{font-size:13px}\n\n .cat-tabs{flex-wrap:wrap;overflow-x:visible}\n\n .custom-add-row{flex-direction:row;align-items:center}\n .custom-add-inputs{flex:1;flex-wrap:nowrap}\n .custom-add-row button{width:auto}\n\n .slider-row{grid-template-columns:140px 1fr auto;align-items:center}\n .slider-row label{grid-column:auto}\n\n .load-summary{display:flex;flex-wrap:wrap;justify-content:space-between;padding:20px 24px;gap:0}\n .load-summary-divider{display:block;width:1px;height:44px;background:rgba(255,255,255,.12)}\n .load-stat{background:transparent;padding:0}\n .load-stat .ls-val{font-size:20px}\n .load-stat .ls-label{font-size:11px}\n\n .usage-cards{grid-template-columns:repeat(2,1fr);gap:12px}\n\n .form-row{grid-template-columns:1fr 1fr;gap:14px}\n .form-row.full{grid-template-columns:1fr}\n .form-group input,.form-group select,.form-group textarea{font-size:14px}\n\n .rec-hero{padding:24px}\n .rec-hero h2{font-size:22px}\n .rh-spec .spec-val{font-size:17px}\n\n .rec-details-grid{grid-template-columns:1fr 1fr}\n\n .action-bar{flex-direction:row;flex-wrap:wrap;gap:12px}\n .btn-action{justify-content:flex-start}\n\n .sle-toast{left:auto;right:20px;max-width:340px}\n\n .email-success-btns{flex-direction:row;justify-content:center;max-width:none}\n}\n\n\/* ================================================\n DESKTOP \u2014 900px+\n ================================================ *\/\n@media(min-width:900px){\n #auxano-sle{padding:0 16px 60px}\n\n .sle-progress{padding:32px 16px 40px}\n .sle-step-dot{width:36px;height:36px;font-size:14px}\n .sle-step-label{font-size:11px;max-width:80px}\n .sle-connector-line{min-width:20px;max-width:80px}\n\n .sle-section-header h2{font-size:28px}\n .sle-section-header{margin-bottom:32px}\n\n .appliance-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}\n .appliance-card{padding:16px 12px}\n .appliance-card .app-icon{font-size:28px}\n .appliance-card:hover{border-color:#F97316;transform:translateY(-2px);box-shadow:0 4px 16px rgba(249,115,22,.12)}\n .qty-btn:hover{background:#F97316;color:#fff}\n\n .usage-cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}\n\n .rec-hero{padding:28px}\n .rec-hero h2{font-size:26px}\n .rh-specs{gap:14px}\n .rh-spec{padding:14px}\n .rh-spec .spec-val{font-size:20px}\n .rh-spec .spec-label{font-size:11px}\n\n .btn-next{flex:none;padding:12px 32px}\n .btn-next:hover{background:#ea6b0a;transform:translateY(-1px);box-shadow:0 4px 14px rgba(249,115,22,.35)}\n .btn-back:hover{border-color:#94a3b8;color:#1e293b}\n .btn-primary-action:hover{background:#ea6b0a;transform:translateY(-1px);box-shadow:0 4px 14px rgba(249,115,22,.35)}\n .btn-secondary-action:hover{border-color:#F97316;color:#F97316}\n\n .cost-table{font-size:14px}\n .cost-table th{padding:10px 14px}\n .cost-table td{padding:12px 14px}\n}\n<\/style>\n\n<!-- ==========================================\n AUXANO SOLAR SMART LOAD ESTIMATOR WIDGET\n Paste from here into your page HTML\n ========================================== -->\n<div id=\"auxano-sle\">\n\n <!-- STEP PROGRESS -->\n <div class=\"sle-progress\" id=\"sle-progress\">\n <div class=\"sle-step-wrap active\" data-step=\"1\" id=\"swrap-1\">\n <div class=\"sle-step-dot\">1<\/div>\n <div class=\"sle-step-label\">Select Appliances<\/div>\n <\/div>\n <div class=\"sle-connector-line\" id=\"conn-1\"><\/div>\n <div class=\"sle-step-wrap\" data-step=\"2\" id=\"swrap-2\">\n <div class=\"sle-step-dot\">2<\/div>\n <div class=\"sle-step-label\">Usage Profile<\/div>\n <\/div>\n <div class=\"sle-connector-line\" id=\"conn-2\"><\/div>\n <div class=\"sle-step-wrap\" data-step=\"3\" id=\"swrap-3\">\n <div class=\"sle-step-dot\">3<\/div>\n <div class=\"sle-step-label\">Your Details<\/div>\n <\/div>\n <div class=\"sle-connector-line\" id=\"conn-3\"><\/div>\n <div class=\"sle-step-wrap\" data-step=\"4\" id=\"swrap-4\">\n <div class=\"sle-step-dot\">4<\/div>\n <div class=\"sle-step-label\">AI Analysis<\/div>\n <\/div>\n <div class=\"sle-connector-line\" id=\"conn-4\"><\/div>\n <div class=\"sle-step-wrap\" data-step=\"5\" id=\"swrap-5\">\n <div class=\"sle-step-dot\">5<\/div>\n <div class=\"sle-step-label\">Your Report<\/div>\n <\/div>\n <\/div>\n\n <!-- ========== STEP 1: SELECT APPLIANCES ========== -->\n <div id=\"step-1\" class=\"sle-screen\">\n <div class=\"sle-section-header\">\n <h2>Select Your <span class=\"sle-orange\">Appliances<\/span><\/h2>\n <p>Choose everything you want to power. We'll calculate the perfect Auxano inverter system for your exact needs.<\/p>\n <\/div>\n\n <div class=\"cat-tabs\" id=\"cat-tabs\">\n <div class=\"cat-tab active\" data-cat=\"all\">All<\/div>\n <div class=\"cat-tab\" data-cat=\"cooling\">Cooling<\/div>\n <div class=\"cat-tab\" data-cat=\"kitchen\">Kitchen<\/div>\n <div class=\"cat-tab\" data-cat=\"lighting\">Lighting<\/div>\n <div class=\"cat-tab\" data-cat=\"entertainment\">Entertainment<\/div>\n <div class=\"cat-tab\" data-cat=\"office\">Office<\/div>\n <div class=\"cat-tab\" data-cat=\"water\">Water & Pumps<\/div>\n <div class=\"cat-tab\" data-cat=\"security\">Security<\/div>\n <\/div>\n\n <div class=\"appliance-grid\" id=\"appliance-grid\"><\/div>\n\n <div class=\"custom-add-row\">\n <span style=\"font-size:20px\">\u2795<\/span>\n <input type=\"text\" id=\"custom-name\" placeholder=\"Custom appliance name...\" \/>\n <input type=\"number\" id=\"custom-watts\" placeholder=\"Watts\" style=\"max-width:100px\" min=\"1\" \/>\n <button onclick=\"addCustomAppliance()\">Add<\/button>\n <\/div>\n\n <div class=\"hours-section\" style=\"margin-top:20px\">\n <h3>\u23f1 Daily Usage Hours<\/h3>\n <p class=\"text-muted mb-12\">Adjust how many hours per day each category runs<\/p>\n <div id=\"hours-sliders\"><\/div>\n <\/div>\n\n <div class=\"load-summary\" id=\"load-summary\">\n <div class=\"load-stat\">\n <div class=\"ls-val\" id=\"ls-total-watts\">0 W<\/div>\n <div class=\"ls-label\">Total Connected Load<\/div>\n <\/div>\n <div class=\"load-summary-divider\"><\/div>\n <div class=\"load-stat\">\n <div class=\"ls-val\" id=\"ls-daily-kwh\">0.0 kWh<\/div>\n <div class=\"ls-label\">Daily Energy Needed<\/div>\n <\/div>\n <div class=\"load-summary-divider\"><\/div>\n <div class=\"load-stat\">\n <div class=\"ls-val\" id=\"ls-appliance-count\">0<\/div>\n <div class=\"ls-label\">Appliances Selected<\/div>\n <\/div>\n <div class=\"load-summary-divider\"><\/div>\n <div class=\"load-stat\">\n <div class=\"ls-val\" id=\"ls-inverter-estimate\">\u2013<\/div>\n <div class=\"ls-label\">Estimated Inverter Size<\/div>\n <\/div>\n <\/div>\n\n <div class=\"sle-nav\">\n <div><\/div>\n <button class=\"btn-next\" id=\"step1-next\" onclick=\"goToStep(2)\" disabled>\n Continue to Usage Profile <span>\u2192<\/span>\n <\/button>\n <\/div>\n <\/div>\n\n <!-- ========== STEP 2: USAGE PROFILE ========== -->\n <div id=\"step-2\" class=\"sle-screen hidden\">\n <div class=\"sle-section-header\">\n <h2>Your <span class=\"sle-orange\">Usage Profile<\/span><\/h2>\n <p>Tell us about your power situation so we can fine-tune the recommendation for your location and needs.<\/p>\n <\/div>\n\n <div style=\"margin-bottom:20px\">\n <h3 style=\"font-size:15px;font-weight:700;color:#1e293b;margin-bottom:14px\">How often does NEPA supply power?<\/h3>\n <div class=\"usage-cards\" id=\"nepa-cards\">\n <div class=\"usage-card\" data-nepa=\"0\" onclick=\"selectNepa(this)\">\n <div class=\"uc-icon\">\ud83d\udd34<\/div>\n <div class=\"uc-name\">No Grid (0\u20132 hrs)<\/div>\n <div class=\"uc-desc\">Essentially off-grid. Generator or solar only situation.<\/div>\n <\/div>\n <div class=\"usage-card\" data-nepa=\"4\" onclick=\"selectNepa(this)\">\n <div class=\"uc-icon\">\ud83d\udfe1<\/div>\n <div class=\"uc-name\">Occasional (2\u20136 hrs)<\/div>\n <div class=\"uc-desc\">Light grid supply. Primary reliance on backup power.<\/div>\n <\/div>\n <div class=\"usage-card\" data-nepa=\"10\" onclick=\"selectNepa(this)\">\n <div class=\"uc-icon\">\ud83d\udfe0<\/div>\n <div class=\"uc-name\">Moderate (6\u201312 hrs)<\/div>\n <div class=\"uc-desc\">Half-day supply. Common in most Nigerian cities.<\/div>\n <\/div>\n <div class=\"usage-card\" data-nepa=\"18\" onclick=\"selectNepa(this)\">\n <div class=\"uc-icon\">\ud83d\udfe2<\/div>\n <div class=\"uc-name\">Good (12\u201320 hrs)<\/div>\n <div class=\"uc-desc\">Regular supply. Need modest backup for outages.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div style=\"margin-bottom:20px\">\n <h3 style=\"font-size:15px;font-weight:700;color:#1e293b;margin-bottom:14px\">What is the primary goal?<\/h3>\n <div class=\"usage-cards\" id=\"goal-cards\">\n <div class=\"usage-card\" data-goal=\"backup\" onclick=\"selectGoal(this)\">\n <div class=\"uc-icon\">\ud83d\udd0b<\/div>\n <div class=\"uc-name\">NEPA Backup<\/div>\n <div class=\"uc-desc\">Keep appliances running during outages. Cost-efficient approach.<\/div>\n <\/div>\n <div class=\"usage-card\" data-goal=\"hybrid\" onclick=\"selectGoal(this)\">\n <div class=\"uc-icon\">\u2600\ufe0f<\/div>\n <div class=\"uc-name\">Hybrid Solar<\/div>\n <div class=\"uc-desc\">Solar + battery + grid. Reduce bills and maintain backup.<\/div>\n <\/div>\n <div class=\"usage-card\" data-goal=\"offgrid\" onclick=\"selectGoal(this)\">\n <div class=\"uc-icon\">\ud83c\udf0d<\/div>\n <div class=\"uc-name\">Full Off-Grid<\/div>\n <div class=\"uc-desc\">Total independence from NEPA. 100% solar powered.<\/div>\n <\/div>\n <div class=\"usage-card\" data-goal=\"business\" onclick=\"selectGoal(this)\">\n <div class=\"uc-icon\">\ud83c\udfe2<\/div>\n <div class=\"uc-name\">Business \/ Commercial<\/div>\n <div class=\"uc-desc\">Critical uptime for business operations. Reliability first.<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"hours-section\">\n <h3>\ud83c\udf0d Your Location (for solar irradiance data)<\/h3>\n <div class=\"form-row\" style=\"margin-top:14px\">\n <div class=\"form-group\">\n <label>State \/ Region<\/label>\n <select id=\"state-select\">\n <option value=\"\">-- Select State --<\/option>\n <option value=\"lagos\">Lagos<\/option>\n <option value=\"abuja\">FCT Abuja<\/option>\n <option value=\"kano\">Kano<\/option>\n <option value=\"rivers\">Rivers<\/option>\n <option value=\"ogun\">Ogun<\/option>\n <option value=\"oyo\">Oyo<\/option>\n <option value=\"delta\">Delta<\/option>\n <option value=\"anambra\">Anambra<\/option>\n <option value=\"kaduna\">Kaduna<\/option>\n <option value=\"other\">Other<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label>Installation Type<\/label>\n <select id=\"install-type\">\n <option value=\"residential\">Residential Home<\/option>\n <option value=\"apartment\">Apartment \/ Flat<\/option>\n <option value=\"commercial\">Commercial \/ Office<\/option>\n <option value=\"industrial\">Industrial<\/option>\n <option value=\"estate\">Estate \/ Compound<\/option>\n <\/select>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"sle-nav\">\n <button class=\"btn-back\" onclick=\"goToStep(1)\">\u2190 Back<\/button>\n <button class=\"btn-next\" id=\"step2-next\" onclick=\"goToStep(3)\" disabled>\n Continue to Your Details <span>\u2192<\/span>\n <\/button>\n <\/div>\n <\/div>\n\n <!-- ========== STEP 3: CONTACT DETAILS ========== -->\n <div id=\"step-3\" class=\"sle-screen hidden\">\n <div class=\"sle-section-header\">\n <h2>Receive Your <span class=\"sle-orange\">Energy Audit Report<\/span><\/h2>\n <p>Enter your details to receive a professional Executive Energy Report with full system specifications, cost breakdown, and ROI analysis.<\/p>\n <\/div>\n\n <div class=\"form-section\">\n <h3>Personal Information<\/h3>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>First Name <span class=\"required-star\">*<\/span><\/label>\n <input type=\"text\" id=\"fname\" placeholder=\"e.g. Chukwuemeka\" required \/>\n <\/div>\n <div class=\"form-group\">\n <label>Last Name <span class=\"required-star\">*<\/span><\/label>\n <input type=\"text\" id=\"lname\" placeholder=\"e.g. Okafor\" required \/>\n <\/div>\n <\/div>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Email Address <span class=\"required-star\">*<\/span><\/label>\n <input type=\"email\" id=\"email\" placeholder=\"you@example.com\" required \/>\n <\/div>\n <div class=\"form-group\">\n <label>Phone Number <span class=\"required-star\">*<\/span><\/label>\n <input type=\"tel\" id=\"phone\" placeholder=\"+234 800 000 0000\" required \/>\n <\/div>\n <\/div>\n <div class=\"form-row full\">\n <div class=\"form-group\">\n <label>Address \/ Installation Location<\/label>\n <input type=\"text\" id=\"address\" placeholder=\"Street, City, State\" \/>\n <\/div>\n <\/div>\n <\/div>\n\n <div class=\"form-section\">\n <h3>Budget & Additional Notes<\/h3>\n <div class=\"form-row\">\n <div class=\"form-group\">\n <label>Approximate Budget Range (\u20a6)<\/label>\n <select id=\"budget\">\n <option value=\"\">Not sure yet<\/option>\n <option value=\"under-500k\">Under \u20a6500,000<\/option>\n <option value=\"500k-1m\">\u20a6500,000 \u2013 \u20a61,000,000<\/option>\n <option value=\"1m-2m\">\u20a61,000,000 \u2013 \u20a62,000,000<\/option>\n <option value=\"2m-5m\">\u20a62,000,000 \u2013 \u20a65,000,000<\/option>\n <option value=\"5m-10m\">\u20a65,000,000 \u2013 \u20a610,000,000<\/option>\n <option value=\"above-10m\">Above \u20a610,000,000<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label>When do you need this installed?<\/label>\n <select id=\"timeline\">\n <option value=\"asap\">As soon as possible<\/option>\n <option value=\"1month\">Within 1 month<\/option>\n <option value=\"3months\">1\u20133 months<\/option>\n <option value=\"6months\">3\u20136 months<\/option>\n <option value=\"planning\">Just planning for now<\/option>\n <\/select>\n <\/div>\n <\/div>\n <div class=\"form-row full\">\n <div class=\"form-group\">\n <label>Additional Notes or Special Requirements<\/label>\n <textarea id=\"notes\" placeholder=\"e.g. we have a borehole pump that runs twice a day, existing generator we want to integrate, specific roof constraints...\"><\/textarea>\n <\/div>\n <\/div>\n <div style=\"display:flex;align-items:flex-start;gap:10px;margin-top:4px\">\n <input type=\"checkbox\" id=\"consent\" style=\"margin-top:3px;accent-color:#F97316;width:16px;height:16px;flex-shrink:0\" \/>\n <label for=\"consent\" style=\"font-size:13px;color:#64748b;cursor:pointer;line-height:1.5\">\n I agree to receive my personalised energy audit report and related information from Auxano Solar Nigeria. My data will not be sold to third parties.\n <\/label>\n <\/div>\n <\/div>\n\n <div class=\"sle-nav\">\n <button class=\"btn-back\" onclick=\"goToStep(2)\">\u2190 Back<\/button>\n <button class=\"btn-next\" id=\"step3-next\" onclick=\"runAIAnalysis()\">\n \ud83e\udd16 Generate AI Analysis <span>\u2192<\/span>\n <\/button>\n <\/div>\n <\/div>\n\n <!-- ========== STEP 4: AI ANALYSIS ========== -->\n <div id=\"step-4\" class=\"sle-screen hidden\">\n <div class=\"ai-analyzing\" id=\"ai-analyzing-view\">\n <div class=\"spinner\"><\/div>\n <h3>AI Engine Analysing Your Load<\/h3>\n <p>Our system is calculating the optimal Auxano Solar configuration for your exact needs<\/p>\n <ul class=\"ai-status-steps\" id=\"ai-steps\">\n <li class=\"ai-status-step active\" id=\"ais-1\"><span class=\"step-dot\"><\/span> Calculating total energy demand\u2026<\/li>\n <li class=\"ai-status-step\" id=\"ais-2\"><span class=\"step-dot\"><\/span> Matching Auxano inverter models\u2026<\/li>\n <li class=\"ai-status-step\" id=\"ais-3\"><span class=\"step-dot\"><\/span> Sizing battery bank\u2026<\/li>\n <li class=\"ai-status-step\" id=\"ais-4\"><span class=\"step-dot\"><\/span> Calculating solar panel array\u2026<\/li>\n <li class=\"ai-status-step\" id=\"ais-5\"><span class=\"step-dot\"><\/span> Running ROI & cost analysis\u2026<\/li>\n <li class=\"ai-status-step\" id=\"ais-6\"><span class=\"step-dot\"><\/span> Generating executive report\u2026<\/li>\n <\/ul>\n <\/div>\n <\/div>\n\n <!-- ========== STEP 5: RESULTS & REPORT ========== -->\n <div id=\"step-5\" class=\"sle-screen hidden\">\n <div class=\"sle-section-header\">\n <h2>Your <span class=\"sle-orange\">Executive Energy Report<\/span><\/h2>\n <p id=\"step5-greeting\">Here is your personalised Auxano Solar system recommendation.<\/p>\n <\/div>\n\n <!-- HERO RECOMMENDATION -->\n <div class=\"rec-hero\" id=\"rec-hero\">\n <div class=\"rh-badge\">\u26a1 AI-Recommended System<\/div>\n <h2 id=\"rec-inverter-name\">Auxano 5kVA Hybrid Inverter<\/h2>\n <div class=\"rh-subtitle\" id=\"rec-inverter-sub\">Perfect for your daily load of <span id=\"rec-daily-kwh\">0<\/span> kWh<\/div>\n <div class=\"rh-specs\">\n <div class=\"rh-spec\">\n <div class=\"spec-val\" id=\"rec-inv-kva\">5 kVA<\/div>\n <div class=\"spec-label\">Inverter Capacity<\/div>\n <\/div>\n <div class=\"rh-spec\">\n <div class=\"spec-val\" id=\"rec-battery\">2\u00d7 200Ah<\/div>\n <div class=\"spec-label\">Battery Bank<\/div>\n <\/div>\n <div class=\"rh-spec\">\n <div class=\"spec-val\" id=\"rec-panels\">8\u00d7 400W<\/div>\n <div class=\"spec-label\">Solar Panels<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- DETAILS GRID -->\n <div class=\"rec-details-grid\">\n <div class=\"rec-detail-card\">\n <h4>System Features<\/h4>\n <ul id=\"rec-features\"><\/ul>\n <\/div>\n <div class=\"rec-detail-card\">\n <h4>Why This System?<\/h4>\n <ul id=\"rec-why\"><\/ul>\n <\/div>\n <\/div>\n\n <!-- APPLIANCE BREAKDOWN TABLE -->\n <div class=\"form-section\" style=\"padding:0;overflow:hidden\">\n <div style=\"padding:14px 16px;border-bottom:1px solid #f1f5f9\">\n <h3 style=\"border:none;padding:0;margin:0;font-size:14px\">Appliance Load Breakdown<\/h3>\n <\/div>\n <div style=\"overflow-x:auto;-webkit-overflow-scrolling:touch\">\n <table class=\"cost-table\" id=\"appliance-breakdown-table\">\n <thead>\n <tr>\n <th>Appliance<\/th>\n <th>Qty<\/th>\n <th>Unit (W)<\/th>\n <th>Total (W)<\/th>\n <th>Daily Hrs<\/th>\n <th>Daily (Wh)<\/th>\n <\/tr>\n <\/thead>\n <tbody id=\"breakdown-tbody\"><\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <!-- COST BREAKDOWN -->\n <div class=\"form-section\" style=\"padding:0;overflow:hidden;margin-top:12px\">\n <div style=\"padding:14px 16px;border-bottom:1px solid #f1f5f9\">\n <h3 style=\"border:none;padding:0;margin:0;font-size:14px\">Estimated Cost Breakdown (\u20a6)<\/h3>\n <\/div>\n <div style=\"overflow-x:auto;-webkit-overflow-scrolling:touch\">\n <table class=\"cost-table\" id=\"cost-table\">\n <thead>\n <tr><th>Component<\/th><th>Specification<\/th><th>Est. Cost (\u20a6)<\/th><\/tr>\n <\/thead>\n <tbody id=\"cost-tbody\"><\/tbody>\n <\/table>\n <\/div>\n <\/div>\n\n <!-- ROI SECTION -->\n <div class=\"rec-details-grid\" style=\"margin-top:12px\">\n <div class=\"rec-detail-card\">\n <h4>Monthly Savings Analysis<\/h4>\n <div style=\"margin-top:4px\">\n <div class=\"divider\" style=\"margin:10px 0\"><\/div>\n <div style=\"display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px\">\n <span class=\"text-muted\">Current monthly generator\/NEPA spend<\/span>\n <span class=\"font-bold\" id=\"roi-current\">\u20a60<\/span>\n <\/div>\n <div style=\"display:flex;justify-content:space-between;font-size:14px;margin-bottom:8px\">\n <span class=\"text-muted\">Monthly solar operational cost<\/span>\n <span class=\"font-bold\" id=\"roi-solar\">\u20a60<\/span>\n <\/div>\n <div class=\"divider\" style=\"margin:10px 0\"><\/div>\n <div style=\"display:flex;justify-content:space-between;font-size:15px\">\n <span class=\"font-bold\">Monthly Savings<\/span>\n <span class=\"font-bold text-orange\" id=\"roi-savings\">\u20a60<\/span>\n <\/div>\n <div style=\"display:flex;justify-content:space-between;font-size:14px;margin-top:8px\">\n <span class=\"text-muted\">Payback Period<\/span>\n <span class=\"font-bold\" id=\"roi-payback\">~0 months<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"rec-detail-card\">\n <h4>Environmental Impact<\/h4>\n <div style=\"margin-top:8px;display:flex;flex-direction:column;gap:14px\">\n <div>\n <div style=\"font-size:22px;font-weight:800;color:#16a34a\" id=\"env-co2\">0 kg<\/div>\n <div class=\"text-muted\" style=\"font-size:12px;margin-top:2px\">CO\u2082 avoided per year<\/div>\n <\/div>\n <div>\n <div style=\"font-size:22px;font-weight:800;color:#2563eb\" id=\"env-diesel\">0 litres<\/div>\n <div class=\"text-muted\" style=\"font-size:12px;margin-top:2px\">Diesel equivalent saved\/year<\/div>\n <\/div>\n <div>\n <div style=\"font-size:22px;font-weight:800;color:#F97316\" id=\"env-trees\">0<\/div>\n <div class=\"text-muted\" style=\"font-size:12px;margin-top:2px\">Equivalent trees planted<\/div>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <!-- AI INSIGHT BOX -->\n <div style=\"background:linear-gradient(135deg,#FFF7F0,#fff3e8);border:1.5px solid #fed7aa;border-radius:14px;padding:20px;margin:14px 0\">\n <div style=\"display:flex;align-items:center;gap:10px;margin-bottom:12px\">\n <span style=\"font-size:22px\">\ud83e\udd16<\/span>\n <h4 style=\"font-size:15px;font-weight:700;color:#1e293b\">AI Recommendation Note<\/h4>\n <\/div>\n <p style=\"font-size:14px;color:#475569;line-height:1.7\" id=\"ai-note\">Loading AI analysis note\u2026<\/p>\n <\/div>\n\n <!-- ACTION BAR -->\n <div class=\"action-bar\" style=\"border-radius:14px;border:1.5px solid #e2e8f0;margin-top:12px\">\n <button class=\"btn-action btn-primary-action\" onclick=\"sendEmailReport()\" style=\"justify-content:center;flex:1;min-width:200px\">\n \ud83d\udce7 Send Full Report to My Email\n <\/button>\n <button class=\"btn-action btn-secondary-action\" onclick=\"printReport()\" style=\"justify-content:center\">\n \ud83d\udda8\ufe0f Print Report\n <\/button>\n <button class=\"btn-action btn-secondary-action\" onclick=\"restartTool()\" style=\"justify-content:center\">\n \ud83d\udd04 Start Over\n <\/button>\n <a href=\"https:\/\/wa.me\/2349168930626?text=Hello%20Auxano%20Solar%2C%20I%20just%20completed%20an%20energy%20audit%20and%20would%20like%20to%20speak%20to%20an%20expert%20about%20my%20system%20recommendation.\" class=\"btn-action btn-secondary-action\" style=\"text-decoration:none;justify-content:center\">\n \ud83d\udcde Speak to an Expert\n <\/a>\n <\/div>\n\n <!-- EMAIL SENDING STATE -->\n <div id=\"email-sending\" class=\"hidden\" style=\"margin-top:20px;text-align:center;padding:30px;background:#fff;border-radius:14px;border:1.5px solid #e2e8f0\">\n <div class=\"spinner\" style=\"margin:0 auto 14px\"><\/div>\n <h4 style=\"font-weight:700;color:#1e293b\">Sending your report\u2026<\/h4>\n <p class=\"text-muted\" style=\"margin-top:6px\">Preparing your professional Energy Audit PDF and sending to <span id=\"sending-to-email\"><\/span><\/p>\n <\/div>\n\n <!-- EMAIL SUCCESS STATE -->\n <div id=\"email-success\" class=\"email-success hidden\">\n <div class=\"success-circle\">\n <svg viewBox=\"0 0 24 24\"><polyline points=\"20 6 9 17 4 12\"><\/polyline><\/svg>\n <\/div>\n <h2>Report Sent Successfully!<\/h2>\n <p>Your Executive Energy Audit Report has been sent to <strong id=\"success-email\"><\/strong>. Please check your inbox \u2014 and your spam folder just in case.<\/p>\n <div class=\"email-success-btns\">\n <a href=\"https:\/\/wa.me\/2349168930626?text=Hello%20Auxano%20Solar%2C%20I%20just%20completed%20an%20energy%20audit%20and%20would%20like%20to%20speak%20to%20an%20expert%20about%20my%20system%20recommendation.\" class=\"btn-action btn-primary-action\" style=\"text-decoration:none;justify-content:center\">Book a Free Site Survey<\/a>\n <button class=\"btn-action btn-secondary-action\" onclick=\"restartTool()\" style=\"justify-content:center\">Start New Estimate<\/button>\n <\/div>\n <\/div>\n <\/div>\n<\/div>\n\n<!-- TOAST -->\n<div class=\"sle-toast\" id=\"sle-toast\">\n <span class=\"toast-icon\" id=\"toast-icon\">\u2705<\/span>\n <span id=\"toast-msg\">Done!<\/span>\n<\/div>\n\n<script>\n\/\/ ============================================================\n\/\/ AUXANO SOLAR \u2014 SMART LOAD ESTIMATOR ENGINE\n\/\/ Configuration: update EMAILJS_SERVICE_ID \/ TEMPLATE_ID\n\/\/ and ANTHROPIC key (via your backend proxy) below.\n\/\/ ============================================================\n\n\/\/ ---- CONFIG (update before deploying) ----------------------\nconst CFG = {\n \/\/ EmailJS \u2014 sign up free at emailjs.com\n emailjs_service_id: 'YOUR_EMAILJS_SERVICE_ID', \/\/ e.g. 'service_abc123'\n emailjs_template_id: 'YOUR_EMAILJS_TEMPLATE_ID', \/\/ e.g. 'template_xyz'\n emailjs_public_key: 'YOUR_EMAILJS_PUBLIC_KEY', \/\/ e.g. 'AbCdEfG...'\n\n \/\/ Your backend proxy endpoint that calls Anthropic Claude API\n \/\/ Create a simple Express\/PHP endpoint that forwards to api.anthropic.com\n \/\/ Set to empty string '' to use the built-in rule-based engine instead\n ai_proxy_url: '', \/\/ e.g. 'https:\/\/auxanosolar.com\/api\/ai-energy'\n\n \/\/ Company email that receives a BCC of every audit\n company_email: 'info@auxanosolar.com',\n\n \/\/ Auxano inverter product line (watts -> model name, price NGN)\n inverters: [\n { kva:1, watts:800, model:'Auxano 1kVA Pure Sine', price:180000 },\n { kva:1.5, watts:1200, model:'Auxano 1.5kVA Hybrid', price:250000 },\n { kva:2, watts:1600, model:'Auxano 2kVA Hybrid', price:320000 },\n { kva:3, watts:2400, model:'Auxano 3kVA Hybrid', price:480000 },\n { kva:5, watts:4000, model:'Auxano 5kVA Hybrid', price:750000 },\n { kva:7.5, watts:6000, model:'Auxano 7.5kVA Industrial',price:1150000 },\n { kva:10, watts:8000, model:'Auxano 10kVA Industrial', price:1600000 },\n { kva:15, watts:12000, model:'Auxano 15kVA Commercial', price:2400000 },\n { kva:20, watts:16000, model:'Auxano 20kVA Commercial', price:3200000 },\n ],\n battery_price_per_ah: 1800, \/\/ NGN per Ah (12V LiFePO4)\n panel_price_per_unit: 85000, \/\/ NGN per 400W panel\n installation_pct: 0.12, \/\/ 12% of hardware cost\n solar_peak_hours: { lagos:4.5, abuja:5.5, kano:6.2, rivers:4.2, ogun:4.5, oyo:4.8, delta:4.3, anambra:4.6, kaduna:5.8, other:5.0 },\n};\n\n\/\/ ---- APPLIANCE DATABASE ------------------------------------\nconst APPLIANCES = [\n \/\/ Cooling\n {id:'ac1', name:'Air Conditioner (1hp)', watts:750, cat:'cooling', hours:8, icon:'\u2744\ufe0f'},\n {id:'ac15', name:'Air Conditioner (1.5hp)',watts:1100, cat:'cooling', hours:8, icon:'\u2744\ufe0f'},\n {id:'ac2', name:'Air Conditioner (2hp)', watts:1500, cat:'cooling', hours:8, icon:'\u2744\ufe0f'},\n {id:'fan', name:'Ceiling \/ Standing Fan', watts:75, cat:'cooling', hours:10, icon:'\ud83c\udf00'},\n \/\/ Kitchen\n {id:'fridge',name:'Refrigerator', watts:150, cat:'kitchen', hours:24, icon:'\ud83e\uddca'},\n {id:'fridge2',name:'Deep Freezer', watts:250, cat:'kitchen', hours:24, icon:'\ud83e\uddca'},\n {id:'microwave',name:'Microwave Oven', watts:1200, cat:'kitchen', hours:1, icon:'\ud83c\udf72'},\n {id:'blender',name:'Blender \/ Grinder', watts:500, cat:'kitchen', hours:0.5,icon:'\ud83e\udd64'},\n {id:'toaster',name:'Toaster \/ Sandwich M',watts:900, cat:'kitchen', hours:0.3,icon:'\ud83c\udf5e'},\n {id:'kettle',name:'Electric Kettle', watts:1500, cat:'kitchen', hours:0.5,icon:'\u2615'},\n {id:'iron', name:'Electric Iron', watts:1200, cat:'kitchen', hours:1, icon:'\ud83d\udc54'},\n {id:'washing',name:'Washing Machine', watts:500, cat:'kitchen', hours:1, icon:'\ud83e\udee7'},\n \/\/ Lighting\n {id:'led', name:'LED Bulb (10W)', watts:10, cat:'lighting', hours:8, icon:'\ud83d\udca1'},\n {id:'fl', name:'Fluorescent Light (40W)',watts:40, cat:'lighting', hours:8, icon:'\ud83d\udca1'},\n {id:'strip', name:'LED Strip Lights', watts:20, cat:'lighting', hours:6, icon:'\u2728'},\n {id:'outdoor',name:'Outdoor Security Light',watts:50, cat:'lighting', hours:10, icon:'\ud83d\udd26'},\n \/\/ Entertainment\n {id:'tv32', name:'LED TV (32\")', watts:60, cat:'entertainment',hours:6, icon:'\ud83d\udcfa'},\n {id:'tv55', name:'LED TV (55\")', watts:120, cat:'entertainment',hours:6, icon:'\ud83d\udcfa'},\n {id:'dstv', name:'DSTV \/ Set-top Box', watts:30, cat:'entertainment',hours:8, icon:'\ud83d\udce1'},\n {id:'dvd', name:'DVD \/ Blu-ray Player', watts:25, cat:'entertainment',hours:2, icon:'\ud83d\udcbf'},\n {id:'hifi', name:'Home Theatre \/ Hi-Fi', watts:200, cat:'entertainment',hours:4, icon:'\ud83d\udd0a'},\n \/\/ Office\n {id:'laptop',name:'Laptop Computer', watts:65, cat:'office', hours:8, icon:'\ud83d\udcbb'},\n {id:'desktop',name:'Desktop Computer', watts:200, cat:'office', hours:8, icon:'\ud83d\udda5\ufe0f'},\n {id:'monitor',name:'LCD Monitor', watts:40, cat:'office', hours:8, icon:'\ud83d\udda5\ufe0f'},\n {id:'printer',name:'Inkjet Printer', watts:30, cat:'office', hours:2, icon:'\ud83d\udda8\ufe0f'},\n {id:'router', name:'WiFi Router \/ Modem', watts:20, cat:'office', hours:24,icon:'\ud83d\udcf6'},\n {id:'phone', name:'Phone Chargers (x4)', watts:40, cat:'office', hours:3, icon:'\ud83d\udcf1'},\n \/\/ Water\n {id:'pump', name:'Water Pump (0.5hp)', watts:370, cat:'water', hours:2, icon:'\ud83d\udca7'},\n {id:'pump1', name:'Water Pump (1hp)', watts:750, cat:'water', hours:2, icon:'\ud83d\udca7'},\n {id:'borehole',name:'Borehole Pump (1.5hp)',watts:1100, cat:'water', hours:1, icon:'\ud83d\udebf'},\n {id:'heater', name:'Water Heater \/ Geyser', watts:1500, cat:'water', hours:1, icon:'\ud83c\udf21\ufe0f'},\n \/\/ Security\n {id:'cctv', name:'CCTV System (4 cams)', watts:40, cat:'security', hours:24,icon:'\ud83d\udcf7'},\n {id:'alarm', name:'Security Alarm System', watts:15, cat:'security', hours:24,icon:'\ud83d\udd14'},\n {id:'gate', name:'Electric Gate Motor', watts:200, cat:'security', hours:0.5,icon:'\ud83d\udeaa'},\n {id:'intercom',name:'Video Intercom', watts:10, cat:'security', hours:24,icon:'\ud83d\udd14'},\n];\n\n\/\/ ---- STATE -------------------------------------------------\nlet state = {\n currentStep: 1,\n selected: {}, \/\/ {id: qty}\n customAppliances: [],\n categoryHours: {}, \/\/ {cat: hours}\n nepa: null,\n goal: null,\n location: '',\n installType: '',\n contact: {},\n rec: null,\n};\n\n\/\/ Init category hours defaults\n[...new Set(APPLIANCES.map(a=>a.cat))].forEach(cat=>{\n state.categoryHours[cat] = null; \/\/ null = use per-appliance default\n});\n\n\/\/ ---- STEP NAVIGATION ---------------------------------------\nfunction goToStep(n){\n if(n===2 && Object.keys(state.selected).length===0){\n showToast('Please select at least one appliance first','\u26a0\ufe0f');return;\n }\n document.querySelectorAll('.sle-screen').forEach(s=>s.classList.add('hidden'));\n document.getElementById('step-'+n).classList.remove('hidden');\n state.currentStep = n;\n updateProgress(n);\n window.scrollTo({top: document.getElementById('auxano-sle').offsetTop - 20, behavior:'smooth'});\n}\n\nfunction updateProgress(step){\n for(let i=1;i<=5;i++){\n const w = document.getElementById('swrap-'+i);\n const c = document.getElementById('conn-'+i);\n w.classList.remove('active','done');\n if(c) c.classList.remove('done');\n if(i<step){ w.classList.add('done'); if(c) c.classList.add('done'); }\n if(i===step) w.classList.add('active');\n }\n}\n\n\/\/ ---- RENDER APPLIANCES -------------------------------------\nlet activeCategory = 'all';\nfunction renderAppliances(){\n const grid = document.getElementById('appliance-grid');\n const all = [...APPLIANCES,...state.customAppliances];\n const shown = activeCategory==='all' ? all : all.filter(a=>a.cat===activeCategory);\n grid.innerHTML = shown.map(a=>{\n const sel = state.selected[a.id] ? 'selected' : '';\n const qty = state.selected[a.id] || 1;\n return `<div class=\"appliance-card ${sel}\" id=\"card-${a.id}\" onclick=\"toggleAppliance('${a.id}')\">\n <div class=\"check-badge\"><svg viewBox=\"0 0 12 12\"><polyline points=\"2,6 5,9 10,3\"\/><\/svg><\/div>\n <div class=\"app-icon\">${a.icon}<\/div>\n <div class=\"app-name\">${a.name}<\/div>\n <div class=\"app-watts\">${a.watts}W<\/div>\n <div class=\"qty-row\">\n <button class=\"qty-btn\" onclick=\"event.stopPropagation();changeQty('${a.id}',-1)\">\u2212<\/button>\n <span class=\"qty-val\">${qty}<\/span>\n <button class=\"qty-btn\" onclick=\"event.stopPropagation();changeQty('${a.id}',1)\">+<\/button>\n <\/div>\n <\/div>`;\n }).join('');\n}\n\nfunction toggleAppliance(id){\n if(state.selected[id]){ delete state.selected[id]; }\n else { state.selected[id]=1; }\n updateSummary();\n renderAppliances();\n document.getElementById('step1-next').disabled = Object.keys(state.selected).length===0;\n}\n\nfunction changeQty(id,delta){\n if(!state.selected[id]) return;\n state.selected[id] = Math.max(1,state.selected[id]+delta);\n updateSummary();\n renderAppliances();\n}\n\nfunction addCustomAppliance(){\n const name = document.getElementById('custom-name').value.trim();\n const watts = parseInt(document.getElementById('custom-watts').value);\n if(!name || !watts || watts<1){ showToast('Please enter appliance name and wattage','\u26a0\ufe0f'); return; }\n const id = 'custom_'+Date.now();\n state.customAppliances.push({id,name,watts,cat:'office',hours:4,icon:'\ud83d\udd0c'});\n state.selected[id]=1;\n document.getElementById('custom-name').value='';\n document.getElementById('custom-watts').value='';\n updateSummary(); renderAppliances();\n document.getElementById('step1-next').disabled=false;\n showToast(`${name} added!`,'\u2705');\n}\n\n\/\/ ---- CATEGORY TABS -----------------------------------------\ndocument.getElementById('cat-tabs').addEventListener('click',e=>{\n const tab = e.target.closest('.cat-tab'); if(!tab) return;\n document.querySelectorAll('.cat-tab').forEach(t=>t.classList.remove('active'));\n tab.classList.add('active');\n activeCategory = tab.dataset.cat;\n renderAppliances();\n});\n\n\/\/ ---- HOURS SLIDERS -----------------------------------------\nfunction renderHoursSliders(){\n const cats = [...new Set(APPLIANCES.map(a=>a.cat))];\n const catNames = {cooling:'Cooling (AC & Fans)',kitchen:'Kitchen Appliances',lighting:'Lighting',entertainment:'Entertainment',office:'Office & Electronics',water:'Water & Pumps',security:'Security Systems'};\n document.getElementById('hours-sliders').innerHTML = cats.map(cat=>{\n const hrs = state.categoryHours[cat] !== null ? state.categoryHours[cat] : \n Math.round(APPLIANCES.filter(a=>a.cat===cat).reduce((s,a)=>s+a.hours,0)\/APPLIANCES.filter(a=>a.cat===cat).length);\n return `<div class=\"slider-row\">\n <label>${catNames[cat]||cat}<\/label>\n <input type=\"range\" min=\"0\" max=\"24\" step=\"0.5\" value=\"${hrs}\" \n oninput=\"setCatHours('${cat}',+this.value);this.nextElementSibling.textContent=this.value+'h'\" \/>\n <span class=\"val\">${hrs}h<\/span>\n <\/div>`;\n }).join('');\n}\n\nfunction setCatHours(cat,hrs){\n state.categoryHours[cat]=hrs;\n updateSummary();\n}\n\n\/\/ ---- LOAD SUMMARY ------------------------------------------\nfunction updateSummary(){\n const all = [...APPLIANCES,...state.customAppliances];\n let totalW=0, dailyWh=0, count=0;\n for(const [id,qty] of Object.entries(state.selected)){\n const app = all.find(a=>a.id===id); if(!app) continue;\n const hrs = state.categoryHours[app.cat] !== null ? state.categoryHours[app.cat] : app.hours;\n totalW += app.watts * qty;\n dailyWh += app.watts * qty * hrs;\n count++;\n }\n const dailyKwh = dailyWh\/1000;\n document.getElementById('ls-total-watts').textContent = totalW>999 ? (totalW\/1000).toFixed(1)+'kW' : totalW+'W';\n document.getElementById('ls-daily-kwh').textContent = dailyKwh.toFixed(1)+' kWh';\n document.getElementById('ls-appliance-count').textContent = count;\n const inv = pickInverter(totalW);\n document.getElementById('ls-inverter-estimate').textContent = inv ? inv.kva+'kVA' : '\u2013';\n}\n\nfunction pickInverter(watts){\n const load = watts * 1.25; \/\/ 25% safety margin\n return CFG.inverters.find(i=>i.watts>=load) || CFG.inverters[CFG.inverters.length-1];\n}\n\n\/\/ ---- USAGE PROFILE STEP ------------------------------------\nfunction selectNepa(el){\n document.querySelectorAll('#nepa-cards .usage-card').forEach(c=>c.classList.remove('selected'));\n el.classList.add('selected');\n state.nepa = +el.dataset.nepa;\n checkStep2();\n}\nfunction selectGoal(el){\n document.querySelectorAll('#goal-cards .usage-card').forEach(c=>c.classList.remove('selected'));\n el.classList.add('selected');\n state.goal = el.dataset.goal;\n checkStep2();\n}\nfunction checkStep2(){\n state.location = document.getElementById('state-select').value;\n state.installType = document.getElementById('install-type').value;\n document.getElementById('step2-next').disabled = state.nepa===null || state.goal===null;\n}\ndocument.getElementById('state-select').addEventListener('change',checkStep2);\ndocument.getElementById('install-type').addEventListener('change',checkStep2);\n\n\/\/ ---- CONTACT FORM VALIDATION -------------------------------\n['fname','lname','email','phone','consent'].forEach(id=>{\n const el=document.getElementById(id);\n if(el) el.addEventListener('input',validateStep3);\n if(id==='consent') el.addEventListener('change',validateStep3);\n});\nfunction validateStep3(){\n const ok = document.getElementById('fname').value.trim() &&\n document.getElementById('lname').value.trim() &&\n document.getElementById('email').value.includes('@') &&\n document.getElementById('phone').value.trim() &&\n document.getElementById('consent').checked;\n document.getElementById('step3-next').disabled = !ok;\n}\nvalidateStep3();\n\n\/\/ ---- AI ANALYSIS ENGINE ------------------------------------\nasync function runAIAnalysis(){\n state.contact = {\n fname: document.getElementById('fname').value.trim(),\n lname: document.getElementById('lname').value.trim(),\n email: document.getElementById('email').value.trim(),\n phone: document.getElementById('phone').value.trim(),\n address: document.getElementById('address').value.trim(),\n budget: document.getElementById('budget').value,\n timeline: document.getElementById('timeline').value,\n notes: document.getElementById('notes').value.trim(),\n };\n goToStep(4);\n await animateAISteps();\n state.rec = computeRecommendation();\n renderResults();\n goToStep(5);\n}\n\nasync function animateAISteps(){\n const steps = 6;\n for(let i=1;i<=steps;i++){\n await sleep(700+Math.random()*400);\n if(i>1) { const prev=document.getElementById('ais-'+(i-1)); prev.classList.remove('active'); prev.classList.add('done'); prev.querySelector('.step-dot').textContent=''; prev.insertAdjacentHTML('beforeend','<span style=\"margin-left:auto;font-weight:700\">\u2713<\/span>'); }\n document.getElementById('ais-'+i).classList.add('active');\n }\n await sleep(600);\n}\n\nfunction sleep(ms){ return new Promise(r=>setTimeout(r,ms)); }\n\n\/\/ ---- RECOMMENDATION LOGIC ----------------------------------\nfunction computeRecommendation(){\n const all = [...APPLIANCES,...state.customAppliances];\n let totalW=0, dailyWh=0;\n const breakdown=[];\n for(const [id,qty] of Object.entries(state.selected)){\n const app = all.find(a=>a.id===id); if(!app) continue;\n const hrs = state.categoryHours[app.cat]!==null ? state.categoryHours[app.cat] : app.hours;\n const tw = app.watts*qty; const dWh = tw*hrs;\n totalW+=tw; dailyWh+=dWh;\n breakdown.push({...app,qty,hours:hrs,totalW:tw,dailyWh:dWh});\n }\n const dailyKwh = dailyWh\/1000;\n const peakSolarHrs = CFG.solar_peak_hours[state.location]||5.0;\n\n \/\/ Goal-based backup hours needed\n const backupHrs = {backup:6, hybrid:12, offgrid:24, business:16}[state.goal]||8;\n const nepaHrs = state.nepa||0;\n const solarHrsNeeded = Math.max(0,24-nepaHrs);\n\n \/\/ Inverter: load * 1.3 safety\n const inv = pickInverter(totalW);\n\n \/\/ Battery: kWh needed \/ 0.8 DoD \/ 0.9 eff * 1.2 safety, at 48V\n const battKwh = (dailyKwh * (solarHrsNeeded\/24)) \/ 0.8 \/ 0.9 * 1.2;\n const battAh = Math.ceil((battKwh*1000) \/ 48);\n const battUnits = Math.max(2, Math.ceil(battAh\/200));\n const battStr = `${battUnits}\u00d7 200Ah 48V LiFePO4`;\n\n \/\/ Solar panels: kWh needed \/ peak sun hours \/ 0.75 system eff\n const panelKwNeeded = dailyKwh \/ peakSolarHrs \/ 0.75;\n const panels = Math.max(2, Math.ceil(panelKwNeeded*1000\/400));\n const panelStr = `${panels}\u00d7 400W Monocrystalline`;\n\n \/\/ Costs\n const invCost = inv.price;\n const battCost = battUnits * 200 * CFG.battery_price_per_ah;\n const panelCost = panels * CFG.panel_price_per_unit;\n const hardwareCost = invCost+battCost+panelCost;\n const installCost = Math.round(hardwareCost * CFG.installation_pct);\n const totalCost = hardwareCost + installCost;\n\n \/\/ ROI\n const genMonthlyCost = dailyKwh * 30 * 250; \/\/ assume \u20a6250\/kWh generator\n const maintenanceMonthly = Math.round(totalCost * 0.005);\n const savingsMonthly = genMonthlyCost - maintenanceMonthly;\n const paybackMonths = Math.round(totalCost \/ savingsMonthly);\n\n \/\/ Env\n const annualKwh = dailyKwh * 365;\n const co2Kg = Math.round(annualKwh * 0.82);\n const dieselLitres = Math.round(annualKwh \/ 3.8);\n const trees = Math.round(co2Kg \/ 21);\n\n \/\/ AI note\n const goalLabels = {backup:'NEPA backup',hybrid:'hybrid solar',offgrid:'fully off-grid',business:'business-grade'};\n const aiNote = `Based on your selected ${Object.keys(state.selected).length} appliances consuming a daily total of ${dailyKwh.toFixed(1)} kWh, we recommend the <strong>${inv.model}<\/strong> \u2014 sized with a 25% headroom above your ${(totalW\/1000).toFixed(1)} kW connected load. ` +\n `For your ${goalLabels[state.goal]||state.goal} goal with approximately ${nepaHrs} hours of grid supply in ${(state.location||'your area').charAt(0).toUpperCase()+(state.location||'your area').slice(1)}, a ${battUnits}\u00d7 200Ah LiFePO4 battery bank provides approximately ${Math.round(battUnits*200*48\/1000\/(dailyKwh*solarHrsNeeded\/24)*10)\/10} days of autonomy. ` +\n `The ${panels}-panel solar array covers your daytime generation needs based on ${peakSolarHrs} peak sun hours available in your region. With an estimated payback of ${paybackMonths} months, this system represents a sound long-term investment against rising fuel and tariff costs.`;\n\n const features = state.goal==='offgrid'\n ? ['MPPT Solar Charge Controller included','Zero-export \/ island-mode operation','Auto-transfer switch built-in','Remote monitoring via Auxano app','5-year inverter warranty','Lithium battery 10-year life']\n : ['MPPT Solar Charge Controller included','Seamless NEPA \/ solar switching','Grid-tie \/ export capability','Remote monitoring via Auxano app','5-year inverter warranty','Smart load management firmware'];\n\n const why = [\n `Load headroom: your ${(totalW\/1000).toFixed(1)} kW load fits comfortably within the ${inv.kva} kVA rating`,\n `LiFePO4 chemistry: safer, longer-lasting than lead-acid (3000+ cycles)`,\n `Monocrystalline panels deliver 22%+ efficiency in Nigerian climate`,\n state.goal==='business' ? 'N+1 redundancy design for critical uptime' : `Sized for ${solarHrsNeeded}h daily off-grid autonomy`,\n `Auxano factory support: local spare parts, same-day Lagos support`,\n `IEC & T\u00dcV certified \u2014 matches your installation type (${state.installType})`,\n ];\n\n return {\n inv, battStr, panelStr, dailyKwh, totalW,\n breakdown, invCost, battCost, panelCost, installCost, totalCost,\n genMonthlyCost, maintenanceMonthly, savingsMonthly, paybackMonths,\n co2Kg, dieselLitres, trees, aiNote, features, why, battUnits, panels\n };\n}\n\n\/\/ ---- RENDER RESULTS ----------------------------------------\nfunction renderResults(){\n const r = state.rec; const c = state.contact;\n document.getElementById('step5-greeting').textContent =\n `Hi ${c.fname} \u2014 here is your personalised Auxano Solar system recommendation.`;\n document.getElementById('rec-inverter-name').textContent = r.inv.model;\n document.getElementById('rec-inverter-sub').innerHTML = `Perfect for your daily load of <span id=\"rec-daily-kwh\">${r.dailyKwh.toFixed(1)} kWh<\/span>`;\n document.getElementById('rec-inv-kva').textContent = r.inv.kva+' kVA';\n document.getElementById('rec-battery').textContent = r.battStr;\n document.getElementById('rec-panels').textContent = r.panelStr;\n\n document.getElementById('rec-features').innerHTML = r.features.map(f=>`<li>${f}<\/li>`).join('');\n document.getElementById('rec-why').innerHTML = r.why.map(w=>`<li>${w}<\/li>`).join('');\n\n \/\/ Breakdown table\n document.getElementById('breakdown-tbody').innerHTML = r.breakdown.map(a=>`\n <tr>\n <td>${a.icon} ${a.name}<\/td>\n <td>${a.qty}<\/td>\n <td>${a.watts}W<\/td>\n <td>${a.totalW}W<\/td>\n <td>${a.hours}h<\/td>\n <td>${Math.round(a.dailyWh)}Wh<\/td>\n <\/tr>`).join('') + `<tr>\n <td colspan=\"3\"><strong>TOTAL<\/strong><\/td>\n <td><strong>${r.totalW}W<\/strong><\/td>\n <td>\u2014<\/td>\n <td><strong>${Math.round(r.dailyKwh*1000)}Wh<\/strong><\/td>\n <\/tr>`;\n\n \/\/ Cost table\n const fmt = n => '\u20a6'+n.toLocaleString();\n document.getElementById('cost-tbody').innerHTML = `\n <tr><td>${r.inv.model}<\/td><td>${r.inv.kva} kVA Hybrid Inverter<\/td><td>${fmt(r.invCost)}<\/td><\/tr>\n <tr><td>LiFePO4 Battery Bank<\/td><td>${r.battStr}<\/td><td>${fmt(r.battCost)}<\/td><\/tr>\n <tr><td>Solar Panel Array<\/td><td>${r.panelStr}<\/td><td>${fmt(r.panelCost)}<\/td><\/tr>\n <tr><td>Installation & Commissioning<\/td><td>Labour, wiring, mounting, testing<\/td><td>${fmt(r.installCost)}<\/td><\/tr>\n <tr><td colspan=\"2\"><strong>Total Estimated Investment<\/strong><\/td><td><strong>${fmt(r.totalCost)}<\/strong><\/td><\/tr>`;\n\n document.getElementById('roi-current').textContent = '\u20a6'+r.genMonthlyCost.toLocaleString();\n document.getElementById('roi-solar').textContent = '\u20a6'+r.maintenanceMonthly.toLocaleString();\n document.getElementById('roi-savings').textContent = '\u20a6'+r.savingsMonthly.toLocaleString();\n document.getElementById('roi-payback').textContent = '~'+r.paybackMonths+' months';\n document.getElementById('env-co2').textContent = r.co2Kg.toLocaleString()+' kg';\n document.getElementById('env-diesel').textContent = r.dieselLitres.toLocaleString()+' litres';\n document.getElementById('env-trees').textContent = r.trees.toLocaleString();\n document.getElementById('ai-note').innerHTML = r.aiNote;\n}\n\n\/\/ ---- EMAIL REPORT ------------------------------------------\nasync function sendEmailReport(){\n const c = state.contact; const r = state.rec;\n const successEl = document.getElementById('email-success');\n const sendingEl = document.getElementById('email-sending');\n\n document.getElementById('sending-to-email').textContent = c.email;\n document.getElementById('success-email').textContent = c.email;\n sendingEl.classList.remove('hidden');\n window.scrollTo({top: sendingEl.offsetTop - 80, behavior:'smooth'});\n\n const payload = {\n to_name: c.fname + ' ' + c.lname,\n to_email: c.email,\n phone: c.phone,\n address: c.address || 'Not provided',\n inverter: r.inv.model,\n battery: r.battStr,\n panels: r.panelStr,\n daily_kwh: r.dailyKwh.toFixed(1) + ' kWh',\n total_cost: '\u20a6' + r.totalCost.toLocaleString(),\n monthly_savings: '\u20a6' + r.savingsMonthly.toLocaleString(),\n payback_months: r.paybackMonths,\n co2_avoided: r.co2Kg.toLocaleString() + ' kg\/year',\n goal: state.goal,\n location: state.location || 'Nigeria',\n budget: c.budget || 'Not specified',\n timeline: c.timeline,\n notes: c.notes || 'None',\n ai_note: r.aiNote.replace(\/<[^>]+>\/g, ''),\n appliance_list: r.breakdown.map(a =>\n '\u2022 ' + a.qty + 'x ' + a.name + ' (' + a.watts + 'W x ' + a.hours + 'h = ' + Math.round(a.dailyWh) + 'Wh\/day)'\n ).join('\\n'),\n };\n\n try {\n const res = await fetch('https:\/\/auxanosolar.com\/energy-audit-mailer.php', {\n method: 'POST',\n headers: {'Content-Type': 'application\/json'},\n body: JSON.stringify(payload)\n });\n const json = await res.json();\n sendingEl.classList.add('hidden');\n if(json.success){\n successEl.classList.remove('hidden');\n showToast('Report sent to ' + c.email, '\ud83d\udce7');\n } else {\n showToast('Could not send email. Please try again.', '\u274c');\n console.error('Mailer error:', json);\n }\n } catch(err){\n sendingEl.classList.add('hidden');\n showToast('Network error. Please try again.', '\u274c');\n console.error(err);\n }\n}\n\nfunction printReport(){\n window.print();\n}\n\nfunction restartTool(){\n state = {\n currentStep:1,selected:{},customAppliances:[],categoryHours:{},\n nepa:null,goal:null,location:'',installType:'',contact:{},rec:null\n };\n [...new Set(APPLIANCES.map(a=>a.cat))].forEach(cat=>{ state.categoryHours[cat]=null; });\n goToStep(1);\n renderAppliances();\n renderHoursSliders();\n updateSummary();\n document.getElementById('step1-next').disabled=true;\n document.getElementById('email-success').classList.add('hidden');\n document.getElementById('email-sending').classList.add('hidden');\n}\n\n\/\/ ---- TOAST -------------------------------------------------\nfunction showToast(msg,icon='\u2139\ufe0f'){\n const t=document.getElementById('sle-toast');\n document.getElementById('toast-msg').textContent=msg;\n document.getElementById('toast-icon').textContent=icon;\n t.classList.add('show');\n setTimeout(()=>t.classList.remove('show'),3200);\n}\n\n\/\/ ---- INIT --------------------------------------------------\nrenderAppliances();\nrenderHoursSliders();\nupdateSummary();\n\n\/\/ Fix: close parenthesis bug in animateAISteps\n\/\/ (The insertAdjacentHTML line above had a stray parenthesis in minified form \u2014 \n\/\/ the version below is the corrected standalone form)\n<\/script>\n\n<!-- EmailJS SDK \u2014 loads only when needed -->\n<script>\n(function(){\n \/\/ Load EmailJS only if configured\n if('YOUR_EMAILJS_SERVICE_ID' !== 'YOUR_EMAILJS_SERVICE_ID' || true){\n var s=document.createElement('script');\n s.src='https:\/\/cdn.jsdelivr.net\/npm\/@emailjs\/browser@4\/dist\/email.min.js';\n s.onload=function(){\n if(typeof emailjs!=='undefined' && 'YOUR_EMAILJS_PUBLIC_KEY'!=='YOUR_EMAILJS_PUBLIC_KEY'){\n emailjs.init({publicKey:'YOUR_EMAILJS_PUBLIC_KEY'});\n }\n };\n document.head.appendChild(s);\n }\n})();\n<\/script>\n\n<\/html>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>  1 Select Appliances 2 Usage Profile 3 Your Details 4 AI Analysis 5 Your Report Select Your Appliances Choose everything you want to power. We’ll calculate the perfect Auxano inverter system for your exact needs. All Cooling Kitchen Lighting Entertainment Office Water & Pumps Security \u2795 Add \u23f1 Daily […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-3178","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/pages\/3178","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/auxanosolar.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=3178"}],"version-history":[{"count":28,"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/pages\/3178\/revisions"}],"predecessor-version":[{"id":3264,"href":"https:\/\/auxanosolar.com\/index.php?rest_route=\/wp\/v2\/pages\/3178\/revisions\/3264"}],"wp:attachment":[{"href":"https:\/\/auxanosolar.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=3178"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}