{"id":1288,"date":"2026-03-18T02:31:47","date_gmt":"2026-03-18T02:31:47","guid":{"rendered":"https:\/\/gqlamp.com\/?page_id=1288"},"modified":"2026-03-18T02:33:07","modified_gmt":"2026-03-18T02:33:07","slug":"teo-calculator","status":"publish","type":"page","link":"https:\/\/gqlamp.com\/ar\/led-street-lights\/teo-calculator\/","title":{"rendered":"\u062d\u0627\u0633\u0628\u0629 \u062a\u064a\u0648"},"content":{"rendered":"\n<div class=\"wp-block-stackable-columns alignfull stk-block-columns stk-block stk-5ccb3c1\" data-block-id=\"5ccb3c1\"><div class=\"stk-row stk-inner-blocks stk-block-content stk-content-align stk-5ccb3c1-column alignfull\">\n<div class=\"wp-block-stackable-column stk-block-column stk-column stk-block stk-6d14013\" data-v=\"4\" data-block-id=\"6d14013\"><div class=\"stk-column-wrapper stk-block-column__content stk-container stk-6d14013-container stk--no-background stk--no-padding\"><div class=\"stk-block-content stk-inner-blocks stk-6d14013-inner-blocks\">\n<!--\n  Solar vs Grid TCO Calculator v1\n  Scope: #bx-tco-calculator-v1\n  Embeddable in WordPress \u2014 no external dependencies\n-->\n<style>\n  \/* \u2500\u2500 Reset & Scope \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 {\n    --c-primary: #183090;\n    --c-accent: #009048;\n    --c-red: #D81818;\n    --c-black: #303030;\n    --c-light: #F4F6FB;\n    --c-border: #D0D5E0;\n    --c-white: #FFFFFF;\n    --font-data: 'IBM Plex Mono', monospace;\n\n    max-width: 1000px;\n    margin: 0 auto;\n    padding: 24px 16px 40px;\n    font-family: inherit;\n    color: var(--c-black);\n    line-height: 1.55;\n    box-sizing: border-box;\n  }\n  #bx-tco-calculator-v1 *,\n  #bx-tco-calculator-v1 *::before,\n  #bx-tco-calculator-v1 *::after {\n    box-sizing: border-box;\n  }\n\n  \/* \u2500\u2500 Typography \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 h2,\n  #bx-tco-calculator-v1 h3,\n  #bx-tco-calculator-v1 h4 {\n    font-family: inherit !important;\n    margin: 0 0 8px;\n    line-height: 1.3;\n  }\n  #bx-tco-calculator-v1 h2 {\n    color: var(--c-primary);\n    margin-bottom: 6px;\n  }\n  #bx-tco-calculator-v1 .bx-subtitle {\n    color: #555;\n    font-size: 0.95rem;\n    margin: 0 0 28px;\n  }\n  #bx-tco-calculator-v1 .bx-data {\n    font-family: var(--font-data);\n  }\n\n  \/* \u2500\u2500 Input Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-inputs {\n    background: var(--c-light);\n    border: 1px solid var(--c-border);\n    border-radius: 10px;\n    padding: 24px 28px 28px;\n    margin-bottom: 28px;\n  }\n  #bx-tco-calculator-v1 .bx-inputs h3 {\n    font-size: 1.05rem;\n    color: var(--c-primary);\n    margin-bottom: 18px;\n  }\n  #bx-tco-calculator-v1 .bx-input-grid {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 18px 24px;\n  }\n  #bx-tco-calculator-v1 .bx-field {\n    display: flex;\n    flex-direction: column;\n    gap: 5px;\n  }\n  #bx-tco-calculator-v1 .bx-field label {\n    font-size: 0.85rem;\n    font-weight: 600;\n    color: #444;\n  }\n  #bx-tco-calculator-v1 .bx-field input[type=\"number\"],\n  #bx-tco-calculator-v1 .bx-field input[type=\"range\"],\n  #bx-tco-calculator-v1 .bx-field select {\n    font-family: var(--font-data);\n    font-size: 0.95rem;\n    padding: 9px 12px;\n    border: 1px solid var(--c-border);\n    border-radius: 6px;\n    background: var(--c-white);\n    color: var(--c-black);\n    outline: none;\n    transition: border-color 0.2s;\n  }\n  #bx-tco-calculator-v1 .bx-field input[type=\"number\"]:focus,\n  #bx-tco-calculator-v1 .bx-field select:focus {\n    border-color: var(--c-primary);\n  }\n  #bx-tco-calculator-v1 .bx-field select option {\n    color: #000018;\n    background: #FFFFFF;\n  }\n  #bx-tco-calculator-v1 .bx-range-row {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n  }\n  #bx-tco-calculator-v1 .bx-range-row input[type=\"range\"] {\n    flex: 1;\n    padding: 0;\n    height: 6px;\n    -webkit-appearance: none;\n    appearance: none;\n    background: var(--c-border);\n    border-radius: 3px;\n    border: none;\n    cursor: pointer;\n  }\n  #bx-tco-calculator-v1 .bx-range-row input[type=\"range\"]::-webkit-slider-thumb {\n    -webkit-appearance: none;\n    appearance: none;\n    width: 20px;\n    height: 20px;\n    border-radius: 50%;\n    background: var(--c-primary);\n    cursor: pointer;\n    border: 2px solid var(--c-white);\n    box-shadow: 0 1px 4px rgba(0,0,0,0.25);\n  }\n  #bx-tco-calculator-v1 .bx-range-row input[type=\"range\"]::-moz-range-thumb {\n    width: 20px;\n    height: 20px;\n    border-radius: 50%;\n    background: var(--c-primary);\n    cursor: pointer;\n    border: 2px solid var(--c-white);\n    box-shadow: 0 1px 4px rgba(0,0,0,0.25);\n  }\n  #bx-tco-calculator-v1 .bx-range-val {\n    font-family: var(--font-data);\n    font-size: 1rem;\n    font-weight: 700;\n    color: var(--c-primary);\n    min-width: 42px;\n    text-align: right;\n  }\n  #bx-tco-calculator-v1 .bx-btn-calc {\n    display: block;\n    width: 100%;\n    margin-top: 22px;\n    padding: 13px 20px;\n    font-size: 1rem;\n    font-weight: 700;\n    font-family: inherit;\n    color: var(--c-white);\n    background: var(--c-primary);\n    border: none;\n    border-radius: 8px;\n    cursor: pointer;\n    transition: background 0.2s, transform 0.1s;\n  }\n  #bx-tco-calculator-v1 .bx-btn-calc:hover {\n    background: #122470;\n  }\n  #bx-tco-calculator-v1 .bx-btn-calc:active {\n    transform: scale(0.985);\n  }\n\n  \/* \u2500\u2500 Results Section \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-results {\n    display: none;\n  }\n  #bx-tco-calculator-v1 .bx-results.bx-visible {\n    display: block;\n  }\n  #bx-tco-calculator-v1 .bx-results-title {\n    font-size: 1.05rem;\n    color: var(--c-primary);\n    margin-bottom: 18px;\n    padding-bottom: 8px;\n    border-bottom: 2px solid var(--c-primary);\n  }\n\n  \/* \u2500\u2500 KPI Cards \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-kpi-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 16px;\n    margin-bottom: 24px;\n  }\n  #bx-tco-calculator-v1 .bx-kpi {\n    border-radius: 10px;\n    padding: 20px 22px;\n    text-align: center;\n  }\n  #bx-tco-calculator-v1 .bx-kpi--solar {\n    background: linear-gradient(135deg, #E8F5EC 0%, #F0FBF4 100%);\n    border: 1px solid #B3E0C0;\n  }\n  #bx-tco-calculator-v1 .bx-kpi--grid {\n    background: linear-gradient(135deg, #F0EFF8 0%, #F7F6FC 100%);\n    border: 1px solid #C8C5E0;\n  }\n  #bx-tco-calculator-v1 .bx-kpi__label {\n    font-size: 0.78rem;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: #666;\n    margin-bottom: 6px;\n  }\n  #bx-tco-calculator-v1 .bx-kpi__value {\n    font-family: var(--font-data);\n    font-size: 1.7rem;\n    font-weight: 700;\n    line-height: 1.2;\n  }\n  #bx-tco-calculator-v1 .bx-kpi--solar .bx-kpi__value {\n    color: var(--c-accent);\n  }\n  #bx-tco-calculator-v1 .bx-kpi--grid .bx-kpi__value {\n    color: var(--c-primary);\n  }\n  #bx-tco-calculator-v1 .bx-kpi__sub {\n    font-size: 0.8rem;\n    color: #777;\n    margin-top: 4px;\n  }\n\n  \/* \u2500\u2500 Savings Cards \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-savings-row {\n    display: grid;\n    grid-template-columns: 1fr 1fr;\n    gap: 16px;\n    margin-bottom: 28px;\n  }\n  #bx-tco-calculator-v1 .bx-saving-card {\n    background: var(--c-white);\n    border: 2px solid var(--c-accent);\n    border-radius: 10px;\n    padding: 18px 20px;\n    text-align: center;\n  }\n  #bx-tco-calculator-v1 .bx-saving-card__label {\n    font-size: 0.78rem;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    color: #555;\n    margin-bottom: 4px;\n  }\n  #bx-tco-calculator-v1 .bx-saving-card__value {\n    font-family: var(--font-data);\n    font-size: 1.45rem;\n    font-weight: 700;\n    color: var(--c-accent);\n  }\n\n  \/* \u2500\u2500 Bar Comparison \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-bars {\n    margin-bottom: 28px;\n  }\n  #bx-tco-calculator-v1 .bx-bars h4 {\n    font-size: 0.95rem;\n    color: var(--c-black);\n    margin-bottom: 14px;\n  }\n  #bx-tco-calculator-v1 .bx-bar-item {\n    margin-bottom: 14px;\n  }\n  #bx-tco-calculator-v1 .bx-bar-label {\n    display: flex;\n    justify-content: space-between;\n    align-items: baseline;\n    font-size: 0.85rem;\n    font-weight: 600;\n    margin-bottom: 5px;\n  }\n  #bx-tco-calculator-v1 .bx-bar-label span:last-child {\n    font-family: var(--font-data);\n    font-weight: 700;\n  }\n  #bx-tco-calculator-v1 .bx-bar-track {\n    width: 100%;\n    height: 28px;\n    background: #E8EAF0;\n    border-radius: 6px;\n    overflow: hidden;\n    position: relative;\n  }\n  #bx-tco-calculator-v1 .bx-bar-fill {\n    height: 100%;\n    border-radius: 6px;\n    transition: width 0.6s ease;\n    min-width: 2%;\n  }\n  #bx-tco-calculator-v1 .bx-bar-fill--solar {\n    background: linear-gradient(90deg, var(--c-accent), #33B86A);\n  }\n  #bx-tco-calculator-v1 .bx-bar-fill--grid {\n    background: linear-gradient(90deg, var(--c-primary), #3A58C0);\n  }\n\n  \/* \u2500\u2500 Cost Breakdown Table \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-breakdown {\n    margin-bottom: 28px;\n  }\n  #bx-tco-calculator-v1 .bx-breakdown h4 {\n    font-size: 0.95rem;\n    color: var(--c-black);\n    margin-bottom: 10px;\n  }\n  #bx-tco-calculator-v1 .bx-table-wrap {\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch;\n  }\n  #bx-tco-calculator-v1 table.bx-tbl {\n    width: 100%;\n    border-collapse: collapse;\n    font-size: 0.85rem;\n  }\n  #bx-tco-calculator-v1 .bx-tbl th {\n    background: var(--c-primary);\n    color: var(--c-white);\n    font-weight: 600;\n    text-align: left;\n    padding: 10px 14px;\n    white-space: nowrap;\n  }\n  #bx-tco-calculator-v1 .bx-tbl th:first-child {\n    border-radius: 6px 0 0 0;\n  }\n  #bx-tco-calculator-v1 .bx-tbl th:last-child {\n    border-radius: 0 6px 0 0;\n  }\n  #bx-tco-calculator-v1 .bx-tbl td {\n    padding: 9px 14px;\n    border-bottom: 1px solid #E8EAF0;\n  }\n  #bx-tco-calculator-v1 .bx-tbl td.bx-num {\n    font-family: var(--font-data);\n    font-weight: 600;\n    text-align: right;\n    white-space: nowrap;\n  }\n  #bx-tco-calculator-v1 .bx-tbl tr:nth-child(even) td {\n    background: #FAFBFD;\n  }\n  #bx-tco-calculator-v1 .bx-tbl tr.bx-total td {\n    font-weight: 700;\n    background: var(--c-light);\n    border-top: 2px solid var(--c-primary);\n  }\n  #bx-tco-calculator-v1 .bx-tbl .bx-col-solar {\n    color: var(--c-accent);\n  }\n  #bx-tco-calculator-v1 .bx-tbl .bx-col-grid {\n    color: var(--c-primary);\n  }\n\n  \/* \u2500\u2500 CTA \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-cta-wrap {\n    text-align: center;\n    padding: 24px 0 0;\n  }\n  #bx-tco-calculator-v1 .bx-cta-msg {\n    font-size: 0.95rem;\n    color: #555;\n    margin-bottom: 14px;\n  }\n  #bx-tco-calculator-v1 .bx-cta-msg strong {\n    color: var(--c-accent);\n  }\n  #bx-tco-calculator-v1 .bx-btn-cta {\n    display: inline-block;\n    padding: 14px 36px;\n    font-size: 1.05rem;\n    font-weight: 700;\n    font-family: inherit;\n    color: var(--c-white);\n    background: var(--c-accent);\n    border: none;\n    border-radius: 8px;\n    cursor: pointer;\n    transition: background 0.2s, transform 0.1s;\n  }\n  #bx-tco-calculator-v1 .bx-btn-cta:hover {\n    background: #007A3C;\n  }\n  #bx-tco-calculator-v1 .bx-btn-cta:active {\n    transform: scale(0.985);\n  }\n\n  \/* \u2500\u2500 Disclaimer \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  #bx-tco-calculator-v1 .bx-disclaimer {\n    font-size: 0.75rem;\n    color: #999;\n    margin-top: 18px;\n    line-height: 1.5;\n    text-align: center;\n  }\n\n  \/* \u2500\u2500 Responsive \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  @media (max-width: 860px) {\n    #bx-tco-calculator-v1 .bx-input-grid {\n      grid-template-columns: 1fr;\n      gap: 14px;\n    }\n    #bx-tco-calculator-v1 .bx-kpi-row,\n    #bx-tco-calculator-v1 .bx-savings-row {\n      grid-template-columns: 1fr;\n      gap: 12px;\n    }\n    #bx-tco-calculator-v1 .bx-inputs {\n      padding: 18px 16px 22px;\n    }\n    #bx-tco-calculator-v1 .bx-kpi__value {\n      font-size: 1.4rem;\n    }\n    #bx-tco-calculator-v1 .bx-saving-card__value {\n      font-size: 1.2rem;\n    }\n  }\n<\/style>\n\n<section id=\"bx-tco-calculator-v1\">\n\n  <h2>Solar vs Grid-Powered Street Light Cost Calculator<\/h2>\n  <p class=\"bx-subtitle\">Compare 10-year total cost of ownership between solar LED and grid-powered LED street lights for your project.<\/p>\n\n  <!-- \u2500\u2500 Input Panel \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"bx-inputs\">\n    <h3>Project Parameters<\/h3>\n    <div class=\"bx-input-grid\">\n\n      <div class=\"bx-field\">\n        <label for=\"bx-fixtures\">Number of Fixtures<\/label>\n        <div class=\"bx-range-row\">\n          <input type=\"range\" id=\"bx-fixtures-range\" min=\"10\" max=\"500\" step=\"5\" value=\"50\">\n          <span class=\"bx-range-val\" id=\"bx-fixtures-val\">50<\/span>\n        <\/div>\n        <input type=\"number\" id=\"bx-fixtures\" min=\"10\" max=\"500\" step=\"1\" value=\"50\" aria-label=\"Number of fixtures\">\n      <\/div>\n\n      <div class=\"bx-field\">\n        <label for=\"bx-wattage\">Average Wattage per Fixture<\/label>\n        <select id=\"bx-wattage\">\n          <option value=\"100\" style=\"color:#000018;background:#FFFFFF\">100W<\/option>\n          <option value=\"150\" style=\"color:#000018;background:#FFFFFF\" selected>150W<\/option>\n          <option value=\"200\" style=\"color:#000018;background:#FFFFFF\">200W<\/option>\n          <option value=\"300\" style=\"color:#000018;background:#FFFFFF\">300W<\/option>\n          <option value=\"400\" style=\"color:#000018;background:#FFFFFF\">400W<\/option>\n          <option value=\"500\" style=\"color:#000018;background:#FFFFFF\">500W<\/option>\n        <\/select>\n      <\/div>\n\n      <div class=\"bx-field\">\n        <label for=\"bx-elec\">Electricity Cost ($\/kWh)<\/label>\n        <input type=\"number\" id=\"bx-elec\" min=\"0.01\" max=\"1.00\" step=\"0.01\" value=\"0.12\">\n      <\/div>\n\n      <div class=\"bx-field\">\n        <label for=\"bx-hours\">Operating Hours per Night<\/label>\n        <input type=\"number\" id=\"bx-hours\" min=\"4\" max=\"16\" step=\"0.5\" value=\"12\">\n      <\/div>\n\n    <\/div>\n\n    <button type=\"button\" class=\"bx-btn-calc\" id=\"bx-btn-calculate\">Calculate 10-Year Cost<\/button>\n  <\/div>\n\n  <!-- \u2500\u2500 Results \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 -->\n  <div class=\"bx-results\" id=\"bx-results\">\n\n    <h3 class=\"bx-results-title\">10-Year Total Cost of Ownership<\/h3>\n\n    <!-- KPI Cards -->\n    <div class=\"bx-kpi-row\">\n      <div class=\"bx-kpi bx-kpi--solar\">\n        <div class=\"bx-kpi__label\">Solar LED &mdash; Total 10-Year Cost<\/div>\n        <div class=\"bx-kpi__value bx-data\" id=\"bx-kpi-solar\">$0<\/div>\n        <div class=\"bx-kpi__sub\">Guangqi GQ-TKJ-B series<\/div>\n      <\/div>\n      <div class=\"bx-kpi bx-kpi--grid\">\n        <div class=\"bx-kpi__label\">Grid LED &mdash; Total 10-Year Cost<\/div>\n        <div class=\"bx-kpi__value bx-data\" id=\"bx-kpi-grid\">$0<\/div>\n        <div class=\"bx-kpi__sub\">Traditional grid-connected<\/div>\n      <\/div>\n    <\/div>\n\n    <!-- Savings Cards -->\n    <div class=\"bx-savings-row\">\n      <div class=\"bx-saving-card\">\n        <div class=\"bx-saving-card__label\">Annual Savings with Solar<\/div>\n        <div class=\"bx-saving-card__value bx-data\" id=\"bx-kpi-annual\">$0<\/div>\n      <\/div>\n      <div class=\"bx-saving-card\">\n        <div class=\"bx-saving-card__label\">Solar Payback Period<\/div>\n        <div class=\"bx-saving-card__value bx-data\" id=\"bx-kpi-payback\">&#8212; yrs<\/div>\n      <\/div>\n    <\/div>\n\n    <!-- Bar Comparison -->\n    <div class=\"bx-bars\">\n      <h4>Cost Comparison<\/h4>\n      <div class=\"bx-bar-item\">\n        <div class=\"bx-bar-label\">\n          <span>Solar LED<\/span>\n          <span class=\"bx-data\" id=\"bx-bar-solar-val\">$0<\/span>\n        <\/div>\n        <div class=\"bx-bar-track\">\n          <div class=\"bx-bar-fill bx-bar-fill--solar\" id=\"bx-bar-solar\" style=\"width:2%\"><\/div>\n        <\/div>\n      <\/div>\n      <div class=\"bx-bar-item\">\n        <div class=\"bx-bar-label\">\n          <span>Grid LED<\/span>\n          <span class=\"bx-data\" id=\"bx-bar-grid-val\">$0<\/span>\n        <\/div>\n        <div class=\"bx-bar-track\">\n          <div class=\"bx-bar-fill bx-bar-fill--grid\" id=\"bx-bar-grid\" style=\"width:2%\"><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <!-- Cost Breakdown Table -->\n    <div class=\"bx-breakdown\">\n      <h4>Cost Breakdown<\/h4>\n      <div class=\"bx-table-wrap\">\n        <table class=\"bx-tbl\">\n          <thead>\n            <tr>\n              <th>Cost Category<\/th>\n              <th style=\"text-align:right\">Solar LED<\/th>\n              <th style=\"text-align:right\">Grid LED<\/th>\n            <\/tr>\n          <\/thead>\n          <tbody id=\"bx-tbody\"><\/tbody>\n        <\/table>\n      <\/div>\n    <\/div>\n\n    <!-- CTA -->\n    <div class=\"bx-cta-wrap\">\n      <p class=\"bx-cta-msg\">Solar saves you an estimated <strong id=\"bx-cta-savings\">$0<\/strong> over 10 years. Ready to get started?<\/p>\n      <button type=\"button\" class=\"bx-btn-cta\" id=\"bx-btn-cta\">Get Project Quote<\/button>\n    <\/div>\n\n    <p class=\"bx-disclaimer\">Estimates are for planning purposes only. Actual costs vary by region, installation conditions, and product configuration. Solar fixture data based on Guangqi GQ-TKJ-B series specifications. Contact us for a detailed site-specific proposal.<\/p>\n\n  <\/div>\n<\/section>\n\n<script>\n(function () {\n  'use strict';\n\n  \/* \u2500\u2500 DOM refs \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  var scope       = document.getElementById('bx-tco-calculator-v1');\n  var elRange     = scope.querySelector('#bx-fixtures-range');\n  var elRangeVal  = scope.querySelector('#bx-fixtures-val');\n  var elFixtures  = scope.querySelector('#bx-fixtures');\n  var elWattage   = scope.querySelector('#bx-wattage');\n  var elElec      = scope.querySelector('#bx-elec');\n  var elHours     = scope.querySelector('#bx-hours');\n  var elBtnCalc   = scope.querySelector('#bx-btn-calculate');\n  var elResults   = scope.querySelector('#bx-results');\n  var elBtnCta    = scope.querySelector('#bx-btn-cta');\n\n  \/* \u2500\u2500 Sync slider \u2194 number input \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  elRange.addEventListener('input', function () {\n    elFixtures.value = this.value;\n    elRangeVal.textContent = this.value;\n  });\n  elFixtures.addEventListener('input', function () {\n    var v = Math.max(10, Math.min(500, parseInt(this.value, 10) || 10));\n    elRange.value = v;\n    elRangeVal.textContent = v;\n  });\n\n  \/* \u2500\u2500 Cost model helpers \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  \/\/ Solar fixture cost scales by wattage: $400 (100W) \u2192 $1200 (500W)\n  function solarFixtureCost(watts) {\n    var map = { 100: 400, 150: 540, 200: 680, 300: 840, 400: 1020, 500: 1200 };\n    return map[watts] || 680;\n  }\n\n  \/\/ Grid fixture cost scales by wattage: $200 (100W) \u2192 $600 (500W)\n  function gridFixtureCost(watts) {\n    var map = { 100: 200, 150: 280, 200: 360, 300: 440, 400: 520, 500: 600 };\n    return map[watts] || 360;\n  }\n\n  \/\/ Battery replacement cost at Year 6: $60 (100W) \u2192 $100 (500W)\n  function batteryReplaceCost(watts) {\n    var map = { 100: 60, 150: 68, 200: 74, 300: 82, 400: 92, 500: 100 };\n    return map[watts] || 74;\n  }\n\n  \/\/ Trenching\/install cost per fixture: $50 (100W) \u2192 $100 (500W)\n  function trenchingCost(watts) {\n    var map = { 100: 50, 150: 60, 200: 70, 300: 80, 400: 90, 500: 100 };\n    return map[watts] || 70;\n  }\n\n  function formatUSD(n) {\n    if (n >= 1000000) return '$' + (n \/ 1000000).toFixed(2) + 'M';\n    if (n >= 1000) return '$' + addCommas(Math.round(n));\n    return '$' + n.toFixed(0);\n  }\n  function formatUSDExact(n) {\n    return '$' + addCommas(Math.round(n));\n  }\n  function addCommas(x) {\n    return x.toString().replace(\/\\B(?=(\\d{3})+(?!\\d))\/g, ',');\n  }\n\n  \/* \u2500\u2500 Main calculation \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  function calculate() {\n    var fixtures = Math.max(10, Math.min(500, parseInt(elFixtures.value, 10) || 50));\n    var watts    = parseInt(elWattage.value, 10) || 150;\n    var elecRate = parseFloat(elElec.value) || 0.12;\n    var hours    = parseFloat(elHours.value) || 12;\n\n    \/\/ \u2500\u2500 Solar costs \u2500\u2500\n    var sFixture    = solarFixtureCost(watts) * fixtures;\n    var sBattery    = batteryReplaceCost(watts) * fixtures; \/\/ Year 6\n    var sElec       = 0;  \/\/ no electricity\n    var sMaint      = 0;  \/\/ maintenance-free after Year 1\n    var sInstall    = 0;  \/\/ no trenching\n    var sTotalCost  = sFixture + sBattery;\n\n    \/\/ \u2500\u2500 Grid costs \u2500\u2500\n    var gFixture    = gridFixtureCost(watts) * fixtures;\n    var gTrench     = trenchingCost(watts) * fixtures;\n    var gElecYear   = (watts \/ 1000) * hours * 365 * elecRate * fixtures;\n    var gElec10     = gElecYear * 10;\n    var gMaint10    = 20 * fixtures * 10;\n    var gTotalCost  = gFixture + gTrench + gElec10 + gMaint10;\n\n    \/\/ \u2500\u2500 Derived \u2500\u2500\n    var totalSavings = gTotalCost - sTotalCost;\n    var annualSavings = totalSavings \/ 10;\n\n    \/\/ Payback: extra upfront solar cost vs annual grid running costs saved\n    var solarUpfront = sFixture; \/\/ solar pays upfront\n    var gridUpfront  = gFixture + gTrench;\n    var extraUpfront = solarUpfront - gridUpfront;\n    var annualGridRunning = gElecYear + (20 * fixtures); \/\/ elec + maint per year\n    var paybackYears = extraUpfront > 0 && annualGridRunning > 0\n      ? extraUpfront \/ annualGridRunning\n      : 0;\n\n    \/\/ \u2500\u2500 Render KPIs \u2500\u2500\n    scope.querySelector('#bx-kpi-solar').textContent = formatUSDExact(sTotalCost);\n    scope.querySelector('#bx-kpi-grid').textContent  = formatUSDExact(gTotalCost);\n    scope.querySelector('#bx-kpi-annual').textContent = formatUSDExact(annualSavings);\n    scope.querySelector('#bx-kpi-payback').textContent = paybackYears > 0\n      ? paybackYears.toFixed(1) + ' yrs'\n      : '< 1 yr';\n\n    \/\/ \u2500\u2500 Render Bars \u2500\u2500\n    var maxCost = Math.max(sTotalCost, gTotalCost);\n    scope.querySelector('#bx-bar-solar').style.width = ((sTotalCost \/ maxCost) * 100).toFixed(1) + '%';\n    scope.querySelector('#bx-bar-grid').style.width  = ((gTotalCost \/ maxCost) * 100).toFixed(1) + '%';\n    scope.querySelector('#bx-bar-solar-val').textContent = formatUSDExact(sTotalCost);\n    scope.querySelector('#bx-bar-grid-val').textContent  = formatUSDExact(gTotalCost);\n\n    \/\/ \u2500\u2500 Render Breakdown Table \u2500\u2500\n    var rows = [\n      { cat: 'Fixture Purchase',        solar: sFixture,   grid: gFixture },\n      { cat: 'Trenching &amp; Install',  solar: sInstall,   grid: gTrench },\n      { cat: 'Electricity (10 years)',   solar: sElec,      grid: gElec10 },\n      { cat: 'Maintenance (10 years)',   solar: sMaint,     grid: gMaint10 },\n      { cat: 'Battery Replace (Year 6)', solar: sBattery,   grid: 0 }\n    ];\n    var html = '';\n    for (var i = 0; i < rows.length; i++) {\n      html += '<tr>';\n      html += '<td>' + rows[i].cat + '<\/td>';\n      html += '<td class=\"bx-num bx-col-solar\">' + formatUSDExact(rows[i].solar) + '<\/td>';\n      html += '<td class=\"bx-num bx-col-grid\">'  + formatUSDExact(rows[i].grid)  + '<\/td>';\n      html += '<\/tr>';\n    }\n    html += '<tr class=\"bx-total\">';\n    html += '<td>Total 10-Year Cost<\/td>';\n    html += '<td class=\"bx-num bx-col-solar\">' + formatUSDExact(sTotalCost) + '<\/td>';\n    html += '<td class=\"bx-num bx-col-grid\">'  + formatUSDExact(gTotalCost) + '<\/td>';\n    html += '<\/tr>';\n    scope.querySelector('#bx-tbody').innerHTML = html;\n\n    \/\/ \u2500\u2500 CTA savings \u2500\u2500\n    scope.querySelector('#bx-cta-savings').textContent = formatUSDExact(totalSavings);\n\n    \/\/ \u2500\u2500 Show results \u2500\u2500\n    elResults.classList.add('bx-visible');\n    elResults.scrollIntoView({ behavior: 'smooth', block: 'start' });\n  }\n\n  \/* \u2500\u2500 Event bindings \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500 *\/\n  elBtnCalc.addEventListener('click', calculate);\n\n  \/\/ CTA opens CT popup\n  elBtnCta.addEventListener('click', function () {\n    \/\/ Try Starter Templates \/ Convert Pro popup trigger\n    var popup = document.querySelector('#ct-popup-801');\n    if (popup) {\n      \/\/ Try common WP popup frameworks\n      if (typeof jQuery !== 'undefined' && jQuery(popup).length) {\n        try { jQuery(popup).trigger('click'); } catch (e) {}\n      }\n      try { popup.click(); } catch (e) {}\n    }\n    \/\/ Fallback: dispatch custom event for CT\n    try {\n      document.dispatchEvent(new CustomEvent('ct-popup-open', { detail: { id: 801 } }));\n    } catch (e) {}\n    \/\/ Also try ConvertPro API\n    if (typeof cpro_popups !== 'undefined') {\n      try { cpro_popups.open(801); } catch (e) {}\n    }\n  });\n\n  \/\/ Auto-calculate on Enter key in any input\n  var inputs = scope.querySelectorAll('input, select');\n  for (var i = 0; i < inputs.length; i++) {\n    inputs[i].addEventListener('keydown', function (e) {\n      if (e.key === 'Enter' || e.keyCode === 13) {\n        e.preventDefault();\n        calculate();\n      }\n    });\n  }\n\n})();\n<\/script>\n<\/div><\/div><\/div>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Solar vs Grid-Powered Street Light Cost Calculator Compare 10-year total cost of ownership between solar LED and grid-powered LED street lights for your project. Project Parameters Number of Fixtures 50 Average Wattage per Fixture 100W150W200W300W400W500W Electricity Cost ($\/kWh) Operating Hours per Night Calculate 10-Year Cost 10-Year Total Cost of Ownership Solar LED &mdash; Total 10-Year [&hellip;]<\/p>\n","protected":false},"author":6,"featured_media":0,"parent":1200,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_gspb_post_css":"","footnotes":""},"class_list":["post-1288","page","type-page","status-publish","hentry"],"blocksy_meta":{"has_hero_section":"disabled","styles_descriptor":{"styles":{"desktop":"","tablet":"","mobile":""},"google_fonts":[],"version":6}},"_links":{"self":[{"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/pages\/1288","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/users\/6"}],"replies":[{"embeddable":true,"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/comments?post=1288"}],"version-history":[{"count":0,"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/pages\/1288\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/pages\/1200"}],"wp:attachment":[{"href":"https:\/\/gqlamp.com\/ar\/wp-json\/wp\/v2\/media?parent=1288"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}