/* Hybrid inverter product pages (scripts/store-inverter-page.mjs). Loaded only
   on the long-form hybrid pages, before store-cro.css, so every rule is scoped
   to .inv-page. The look follows ev-charger.css; the components are the
   inverter's own. */
.inv-page .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.inv-page .inv-tag{font-size:11px;letter-spacing:1px;text-transform:uppercase;color:var(--blue);font-weight:600;margin-bottom:10px}
.inv-page figcaption{font-size:10px;color:var(--muted);padding:8px 4px 0}

/* Hero gallery: product images sit on the grey stage; photos keep their colours.
   Nothing is enlarged past its own size. */
.inv-page .inv-gallery{min-width:0}
.inv-page .inv-stage{position:relative;background:var(--surface);border-radius:18px;aspect-ratio:1/1;max-height:560px;width:100%;overflow:hidden}
.inv-page .inv-stage-img{position:absolute;inset:0;margin:auto;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain}
.inv-page .inv-stage-img.is-product{max-width:82%;max-height:88%;mix-blend-mode:multiply}
.inv-page .inv-thumbs{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin-top:10px}
.inv-page .inv-thumb{aspect-ratio:1/1;border-radius:10px;background:var(--surface);border:1px solid transparent;overflow:hidden;padding:0}
.inv-page .inv-thumb img{width:100%;height:100%;object-fit:cover}
.inv-page .inv-thumb.is-product img{object-fit:contain;padding:6px;mix-blend-mode:multiply}
.inv-page .inv-thumb:hover{border-color:#b9c7d0}
.inv-page .inv-thumb[aria-pressed=true]{border:2px solid var(--blue)}
.inv-page .inv-gallery>p{font-size:10px;color:var(--muted);margin:10px 4px 0}

/* Size switch: every size in the range, one tap apart */
.inv-page .inv-switch{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:22px 0 4px}
.inv-page .inv-switch-option{display:grid;gap:2px;border:1px solid #c6d0d7;border-radius:11px;padding:10px 11px;background:#fff;min-width:0}
.inv-page .inv-switch-option:hover{border-color:var(--blue);background:#f7fafc}
.inv-page .inv-switch-option[aria-current=page]{border:2px solid var(--blue);padding:9px 10px;background:var(--pale)}
.inv-page .inv-switch-kw{font-size:17px;font-weight:500;letter-spacing:-.3px}
.inv-page .inv-switch-note{font-size:11px;color:var(--muted)}
.inv-page .inv-switch-option .live-price{font-size:11.5px;font-weight:500;color:var(--blue);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.inv-page .inv-hero .product-badges{margin:16px 0 20px}
.inv-page .inv-licensed{display:flex;gap:9px;align-items:center;font-size:12px;color:#4d606c;background:#f7f5ef;border-radius:9px;padding:11px 13px;margin:-6px 0 20px}
.inv-page .inv-licensed svg{width:17px;height:17px;color:#8a6d2f;flex-shrink:0}
.inv-page .inv-licensed a{text-decoration:underline;text-underline-offset:3px;color:var(--blue)}

/* What will it run at once? */
.inv-page .inv-calc{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;margin-top:30px;align-items:start}
.inv-page .inv-calc fieldset{border:0;margin:0 0 22px;padding:0;min-width:0}
.inv-page .inv-calc legend{font-size:14px;font-weight:500;margin-bottom:10px;padding:0}
.inv-page .inv-loads{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.inv-page .inv-load{position:relative;display:block;cursor:pointer}
.inv-page .inv-load input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.inv-page .inv-load>span{display:grid;grid-template-columns:20px 1fr;column-gap:8px;align-items:center;height:100%;border:1px solid #c6d0d7;border-radius:10px;padding:10px 11px;background:#fff}
.inv-page .inv-load svg{width:18px;height:18px;color:#6f8290;grid-row:1/3}
.inv-page .inv-load strong{font-size:12.5px;font-weight:500;line-height:1.3}
.inv-page .inv-load small{font-size:10.5px;color:var(--muted)}
.inv-page .inv-load:hover>span{border-color:var(--blue)}
.inv-page .inv-load input:checked+span{border:2px solid var(--blue);padding:9px 10px;background:var(--pale)}
.inv-page .inv-load input:checked+span svg{color:var(--blue)}
.inv-page .inv-load input:focus-visible+span{outline:3px solid #1e77b7;outline-offset:3px}
.inv-page .inv-hint{font-size:11px;color:var(--muted);margin-top:8px}
.inv-page .inv-range{display:grid;gap:8px;font-size:14px;font-weight:500}
.inv-page .inv-range-head{display:flex;justify-content:space-between;gap:12px}
.inv-page .inv-range output{color:var(--blue)}
.inv-page .inv-range input{width:100%;accent-color:var(--blue);min-height:32px}
.inv-page .inv-range small{font-weight:400;color:var(--muted)}
.inv-page .inv-calc-results{border:1px solid var(--line);border-radius:16px;padding:22px;background:linear-gradient(#f7fafc,#fff 140px)}
.inv-page .inv-total{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-bottom:16px}
.inv-page .inv-total strong{font-size:44px;line-height:1;font-weight:500;letter-spacing:-1.5px;color:var(--ink)}
.inv-page .inv-sizes{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.inv-page .inv-size{display:grid;grid-template-columns:58px 1fr;grid-template-areas:"kw meter" "kw status";column-gap:14px;row-gap:5px;align-items:center;padding:9px 10px;border-radius:10px}
.inv-page .inv-size.is-current{background:#eef4f8}
.inv-page .inv-size-kw{grid-area:kw;font-size:15px;font-weight:500}
.inv-page .inv-size-kw a{text-decoration:underline;text-underline-offset:3px}
.inv-page .inv-meter{grid-area:meter;height:8px;border-radius:8px;background:#e3e9ed;overflow:hidden}
.inv-page .inv-meter>span{display:block;height:100%;width:var(--fill,0%);border-radius:8px;background:#3f8f5f;transition:width .25s ease}
.inv-page .inv-size.is-short .inv-meter>span{background:#c9822b}
.inv-page .inv-size.is-idle .inv-meter>span{background:#b9c7d0}
.inv-page .inv-size-line{grid-area:status;display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.inv-page .inv-size-status{font-size:12px;color:#4d606c;margin-right:2px}
.inv-page .inv-size.is-short .inv-size-status{color:#8a5a1b}
.inv-page .inv-best,.inv-page .inv-here{display:none;font-size:10px;font-weight:600;border-radius:20px;padding:3px 8px;white-space:nowrap}
.inv-page .inv-size.is-best .inv-best{display:inline-block;color:#fff;background:var(--blue)}
.inv-page .inv-size.is-current .inv-here{display:inline-block;color:var(--blue);background:#fff;border:1px solid #c6d6e2}
.inv-page .inv-verdict{font-size:14px;font-weight:500;background:var(--pale);border-radius:10px;padding:14px 16px;color:var(--blue);margin-top:14px}
.inv-page .inv-blackout{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.6;color:#4d606c;margin-top:12px}
.inv-page .inv-blackout svg{width:18px;height:18px;color:#3f8f5f;flex-shrink:0;margin-top:2px}
.inv-page .inv-surge{display:flex;gap:10px;align-items:flex-start;font-size:12px;line-height:1.6;color:var(--muted);margin-top:10px;padding-top:12px;border-top:1px solid var(--line)}
.inv-page .inv-surge svg{width:16px;height:16px;color:#8a6d2f;flex-shrink:0;margin-top:2px}
.inv-page .inv-designer{display:flex;gap:10px;align-items:center;margin-top:12px;padding:12px 14px;border:1px solid #c6d6e2;border-radius:10px;background:#fff;font-size:13px;font-weight:500;color:var(--blue)}
.inv-page .inv-designer:hover{border-color:var(--blue);background:#f7fafc}
.inv-page .inv-designer>svg{width:17px;height:17px;flex-shrink:0}
.inv-page .inv-designer>span{flex:1}
.inv-page .inv-stack-cta{margin-top:18px}

/* Set-ups */
/* Set-ups: one tab per set-up, each with an energy-flow diagram. Kieron,
   29 Sep 2026: "three ways to set it up looks a bit bland". */
.inv-page .inv-setup{margin-top:26px}
.inv-page .inv-setup:not(.is-ready) .inv-setup-tabs{display:none}
.inv-page .inv-setup-tabs{display:inline-flex;flex-wrap:wrap;gap:4px;padding:5px;background:var(--surface);border-radius:999px;margin-bottom:18px}
.inv-page .inv-setup-tab{display:inline-flex;align-items:center;gap:8px;border:0;background:transparent;border-radius:999px;padding:10px 16px;font:inherit;font-size:13px;font-weight:500;color:#4d606c;cursor:pointer}
.inv-page .inv-setup-tab svg{width:16px;height:16px}
.inv-page .inv-setup-tab:hover{color:var(--blue)}
.inv-page .inv-setup-tab[aria-selected=true]{background:#fff;color:var(--blue);box-shadow:0 1px 3px rgba(22,37,46,.14)}
.inv-page .inv-setup-tab:focus-visible{outline:3px solid #1e77b7;outline-offset:2px}
.inv-page .inv-setup-panel{display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center;padding:28px;border-radius:22px;background:linear-gradient(135deg,#f4f8fb 0%,#e9f0f5 100%)}
.inv-page .inv-setup-panel+.inv-setup-panel{margin-top:18px}
.inv-page .inv-setup-panel[hidden]{display:none}
.inv-page .inv-setup-copy h3{font-size:24px;font-weight:500;letter-spacing:-.5px;margin-bottom:10px}
.inv-page .inv-setup-copy>p:not(.inv-tag):not(.inv-need){font-size:14px;line-height:1.75;color:#4d606c;margin-bottom:16px}
.inv-page .inv-setup-copy .inv-need{margin-top:18px}
.inv-page .inv-diagram{position:relative;margin:0;aspect-ratio:600/340;background:linear-gradient(180deg,#e6f1f9 0%,#f5f9fc 52%,#fff 78%);border-radius:18px;box-shadow:0 1px 2px rgba(22,37,46,.05),0 10px 30px rgba(21,74,118,.1);overflow:hidden}
.inv-page .inv-diagram>svg{position:absolute;inset:0;width:100%;height:100%}
/* Scene drawings: sun, house with a solar array, tower, generator, old inverter. */
.inv-page .sc-sun circle{fill:#f6b73c}
.inv-page .sc-sun line{stroke:#f6b73c;stroke-width:3;stroke-linecap:round}
.inv-page .sc-chimney{fill:#56646e}
.inv-page .sc-roof{fill:#3e4d58}
.inv-page .sc-panels{fill:#1d3d63;stroke:#c9d6e0;stroke-width:1.5;stroke-linejoin:round}
.inv-page .sc-panel-grid{fill:none;stroke:#86abd0;stroke-width:1.1;opacity:.75}
.inv-page .sc-glare{fill:#fff;opacity:.13}
.inv-page .sc-body{fill:#fff;stroke:#cdd8e0;stroke-width:1.5}
.inv-page .sc-window rect{fill:#e3eef7;stroke:#9fb4c3;stroke-width:1.5}
.inv-page .sc-window path{fill:none;stroke:#9fb4c3;stroke-width:1.5}
.inv-page .sc-window.is-lit rect{fill:#ffe3a1;stroke:#d9b36a}
.inv-page .sc-window.is-lit path{stroke:#d9b36a}
.inv-page .sc-door{fill:var(--blue)}
.inv-page .sc-knob{fill:#f6b73c}
.inv-page .sc-earth{fill:#ebf1f4}
.inv-page .sc-horizon{stroke:#cfdae1;stroke-width:1.5}
.inv-page .sc-shadow{fill:#16252e;opacity:.1}
.inv-page .sc-cloud{fill:#fff;opacity:.9}
.inv-page .sc-steel{fill:none;stroke:#7b8d99;stroke-width:2.4;stroke-linejoin:round;stroke-linecap:round}
.inv-page .sc-insulator{stroke:#4c5d68;stroke-width:3;stroke-linecap:round}
.inv-page .sc-wire{fill:none;stroke:#6d7f8a;stroke-width:1.4}
.inv-page .sc-tower.is-down{opacity:.4}
.inv-page .sc-down circle{fill:#c0392b}
.inv-page .sc-down path{stroke:#fff;stroke-width:2.6;stroke-linecap:round}
.inv-page .sc-gen-body{fill:#d9822b}
.inv-page .sc-gen-top{fill:#b86a1d}
.inv-page .sc-gen-vent{stroke:#fff;stroke-width:2;stroke-linecap:round;opacity:.55}
.inv-page .sc-gen-panel,.inv-page .sc-gen-wheel{fill:#3e4d58}
.inv-page .sc-gen-pipe{fill:none;stroke:#56646e;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.inv-page .sc-old>rect{fill:#edf1f4;stroke:#9aabb7;stroke-width:1.5}
.inv-page .sc-old>.sc-old-screen{fill:#3e4d58;stroke:none}
.inv-page .sc-old-fins{stroke:#9aabb7;stroke-width:1.5}
/* White-background product photos (batteries, the all-in-one) melt into the scene. */
.inv-page .sc-blend{mix-blend-mode:multiply}
.inv-page .sc-backing{fill:#fff}
.inv-page .sc-hub{filter:drop-shadow(0 8px 10px rgba(21,74,118,.18))}
/* Power along the lines: a faint cable with dots moving along it. */
.inv-page .inv-line,.inv-page .inv-track{fill:none;stroke-linecap:round}
.inv-page .inv-track{stroke-width:7;opacity:.15}
.inv-page .inv-line{stroke-width:3.5;stroke-dasharray:1 10;animation:inv-flow 1s linear infinite}
.inv-page .inv-diagram .is-solar{stroke:#e2a012}
.inv-page .inv-diagram .is-battery{stroke:#3f8f5f}
.inv-page .inv-diagram .is-home{stroke:var(--blue)}
.inv-page .inv-diagram .is-grid{stroke:#8093a0}
.inv-page .inv-diagram .is-gen{stroke:#b5651d}
.inv-page .inv-diagram .inv-line.is-idle{animation:none;stroke:#c3ced6;stroke-width:2;stroke-dasharray:5 7}
.inv-page .inv-track.is-idle{display:none}
@keyframes inv-flow{to{stroke-dashoffset:-22}}
/* Labels are HTML so they stay legible when the scene shrinks on a phone. */
.inv-page .inv-label{position:absolute;z-index:1;transform:translate(-50%,-50%);font-size:11.5px;font-weight:500;line-height:1.25;color:#35505f;white-space:nowrap;background:rgba(255,255,255,.92);border-radius:6px;padding:2px 7px;box-shadow:0 1px 2px rgba(22,37,46,.08)}
.inv-page .inv-label.is-hub{font-weight:600;color:#fff;background:var(--blue);border-radius:999px;padding:4px 11px;box-shadow:0 4px 12px rgba(21,74,118,.22)}
.inv-page .inv-label.is-flow{font-size:10px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:#6b7f8c;background:rgba(255,255,255,.75);box-shadow:none}
.inv-page .inv-label.is-down{color:#a3372a;background:#fbeceb}
.inv-page .inv-diagram-badge{position:absolute;left:14px;top:12px;z-index:1;font-size:11px;font-weight:600;color:var(--blue);background:rgba(255,255,255,.92);border-radius:999px;padding:4px 10px;box-shadow:0 1px 2px rgba(22,37,46,.08)}
@media (prefers-reduced-motion:reduce){.inv-page .inv-line{animation:none;stroke-dasharray:none;stroke-width:2.5}}
.inv-page .inv-checks{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.inv-page .inv-checks li{display:flex;gap:10px;font-size:13.5px;line-height:1.55}
.inv-page .inv-checks svg{box-sizing:content-box;width:12px;height:12px;padding:3px;border-radius:50%;background:#e3f1e8;color:#2f7d4f;margin-top:1px;flex-shrink:0;stroke-width:3}
.inv-page .inv-need{font-size:12px;line-height:1.65;color:#5b5140;background:#f7f5ef;border-radius:9px;padding:11px 13px;margin-top:auto}
.inv-page .inv-checks+.inv-need{margin-top:16px}
.inv-page .inv-modes{margin-top:40px}
.inv-page .inv-modes-title{font-size:22px;font-weight:500;letter-spacing:-.4px;margin-bottom:18px}
.inv-page .inv-mode-grid,.inv-page .inv-safety{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 26px}
.inv-page .inv-safety{grid-template-columns:repeat(3,minmax(0,1fr))}
.inv-page .inv-mode-grid svg,.inv-page .inv-safety svg{width:24px;height:24px;color:var(--blue);stroke-width:1.5;margin-bottom:10px}
.inv-page .inv-mode-grid h4,.inv-page .inv-safety h4{font-size:15px;font-weight:500;margin:0 0 6px}
.inv-page .inv-mode-grid p,.inv-page .inv-safety p{font-size:12.5px;line-height:1.7;color:var(--muted)}

/* Features */
.inv-page .inv-rows{display:grid;gap:26px;margin-top:34px}
.inv-page .inv-row{display:grid;grid-template-columns:1.1fr 1fr;gap:46px;align-items:center}
.inv-page .inv-row:nth-child(even) figure{order:2}
.inv-page .inv-row figure{margin:0;border-radius:16px;overflow:hidden;background:var(--surface)}
.inv-page .inv-row figure img{width:100%;height:auto;display:block}
.inv-page .inv-row.is-portrait figure{max-width:420px;justify-self:center;width:100%}
.inv-page .inv-row h3{font-size:26px;font-weight:500;letter-spacing:-.7px;margin-bottom:12px}
.inv-page .inv-row p:not(.inv-tag){font-size:14px;line-height:1.8;color:#4d606c}
.inv-page .inv-stats{list-style:none;padding:0;margin:22px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;border-top:1px solid var(--line);padding-top:18px}
.inv-page .inv-stats strong{display:block;font-size:21px;font-weight:500;letter-spacing:-.5px;color:var(--blue);overflow-wrap:anywhere}
.inv-page .inv-stats span{display:block;font-size:11px;color:var(--muted);margin-top:4px;line-height:1.4}
.inv-page .inv-subhead{font-size:22px;font-weight:500;letter-spacing:-.4px;margin:50px 0 20px}

/* About Deye: one sourced line, not a feature */
.inv-page .inv-about{display:flex;gap:12px;align-items:flex-start;margin-top:26px;background:var(--pale);border-radius:12px;padding:14px 16px}
.inv-page .inv-about svg{width:20px;height:20px;color:var(--blue);flex-shrink:0;margin-top:2px}
.inv-page .inv-about p{font-size:13px;line-height:1.65;color:#35505f;margin:0}
.inv-page .inv-about strong{font-weight:600;color:var(--ink)}
.inv-page .inv-about a{color:var(--blue);text-decoration:underline;text-underline-offset:3px;white-space:nowrap;display:inline-flex;gap:3px;align-items:center}
.inv-page .inv-about a svg{width:13px;height:13px;margin:0}

/* Specifications: tables of very different lengths flow into two columns */
.inv-page .spec-groups{display:block;columns:2;column-gap:30px}
.inv-page .spec-groups .spec-table{break-inside:avoid;margin-bottom:30px}

/* Compare */
.inv-page .inv-table-wrap{overflow-x:auto;margin-top:26px;border:1px solid var(--line);border-radius:14px}
.inv-page .inv-table{width:100%;border-collapse:collapse;font-size:13px;text-align:left;min-width:620px}
.inv-page .inv-table th,.inv-page .inv-table td{padding:13px 18px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.55}
.inv-page .inv-table tbody tr:last-child th,.inv-page .inv-table tbody tr:last-child td{border-bottom:0}
.inv-page .inv-table thead th{background:#edf2f5;font-size:15px;font-weight:500}
.inv-page .inv-table thead th a{text-decoration:underline;text-underline-offset:3px}
.inv-page .inv-table thead th small{display:block;font-size:10px;font-weight:400;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.inv-page .inv-table tbody th{font-weight:400;color:var(--muted);width:28%}
.inv-page .inv-table td{font-weight:500}
.inv-page .inv-table td small{font-weight:400;color:var(--muted)}
.inv-page .inv-table td[data-ask]{font-weight:400;color:#8a98a2}
.inv-page .inv-table .is-current{background:#f3f8fb}
.inv-page .inv-table thead .is-current{background:#dfeaf2;color:var(--blue)}

/* Batteries */
.inv-page .inv-battery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:26px}
.inv-page .inv-battery{display:grid;grid-template-columns:84px 1fr auto;gap:16px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:14px}
.inv-page .inv-battery-art{width:84px;height:84px;border-radius:12px;background:var(--surface);display:grid;place-items:center;overflow:hidden}
.inv-page .inv-battery-art img{width:70px;height:70px;object-fit:contain;mix-blend-mode:multiply}
.inv-page .inv-battery-art svg{width:30px;height:30px;color:var(--blue)}
.inv-page .inv-battery-copy{min-width:0;display:grid;gap:2px}
.inv-page .inv-battery-name{font-size:15px;font-weight:500}
.inv-page .inv-battery-name:hover{color:var(--blue)}
.inv-page .inv-battery-copy small{font-size:10.5px;color:var(--muted);overflow-wrap:anywhere}
.inv-page .inv-battery-copy ul{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:3px;font-size:12px;color:#4d606c}
.inv-page .inv-battery-copy li::before{content:'·';margin-right:6px;color:#8aa0ae}
.inv-page .inv-battery-buy{display:grid;justify-items:end;gap:8px;font-size:12px;text-align:right}
.inv-page .inv-battery-buy .live-price{font-size:14px;font-weight:500;color:var(--ink)}
.inv-page .inv-battery-buy small{color:var(--muted)}
.inv-page .inv-battery .pair-add{display:inline-flex;align-items:center;gap:5px;border:1px solid #becbd3;border-radius:20px;padding:8px 12px;font-size:12px;background:#fff}
.inv-page .inv-battery .pair-add:hover{background:var(--blue);border-color:var(--blue);color:#fff}
.inv-page .inv-battery .pair-add svg{width:14px;height:14px}

/* Installed in Australia */
.inv-page .inv-case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:26px;align-items:start}
.inv-page .inv-case-grid figure{margin:0}
.inv-page .inv-case-grid img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;border-radius:14px;background:var(--surface);display:block}
.inv-page .inv-case-grid figcaption{font-size:12px;color:#4d606c;padding:10px 2px 0;line-height:1.5}

/* Installation */
.inv-page .inv-install{display:grid;grid-template-columns:1.3fr .9fr;gap:50px;align-items:start}
.inv-page .inv-steps{list-style:none;counter-reset:inv;margin:26px 0 0;padding:0;display:grid;gap:4px}
.inv-page .inv-steps li{counter-increment:inv;display:grid;grid-template-columns:36px 1fr;column-gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.inv-page .inv-steps li::before{content:counter(inv);grid-row:1/3;width:30px;height:30px;border-radius:50%;background:var(--pale);color:var(--blue);display:grid;place-items:center;font-size:13px;font-weight:600}
.inv-page .inv-steps strong{font-size:15px;font-weight:500}
.inv-page .inv-steps span{font-size:13px;color:var(--muted);line-height:1.65;margin-top:3px}
.inv-page .inv-box{background:var(--surface);border-radius:16px;padding:26px}
.inv-page .inv-box h3{display:flex;gap:9px;align-items:center;font-size:18px;font-weight:500}
.inv-page .inv-box h3 svg{color:var(--blue)}
.inv-page .inv-box ul{margin:16px 0 10px;padding-left:18px;display:grid;gap:7px;font-size:13px}
.inv-page .inv-box>p{font-size:11px;color:var(--muted)}
.inv-page .inv-ask{margin-top:10px;display:inline-flex;gap:6px;align-items:center;color:var(--blue);text-align:left}
.inv-page .inv-ask svg{width:15px;height:15px}
.inv-page .inv-box-cta{border-top:1px solid #d8dfe3;margin-top:20px;padding-top:18px;display:grid;gap:12px}
.inv-page .inv-box-cta strong{font-size:14px;font-weight:500;line-height:1.5}
.inv-page .inv-box-cta .button{justify-self:start}

@media(max-width:1100px){
 .inv-page .inv-setup-panel{grid-template-columns:1fr;gap:26px}
 .inv-page .inv-calc{grid-template-columns:1fr;gap:26px}
 .inv-page .spec-groups{columns:1}
 .inv-page .inv-mode-grid{grid-template-columns:1fr 1fr}
 .inv-page .inv-install{grid-template-columns:1fr;gap:26px}
 .inv-page .inv-row{gap:30px}
 .inv-page .inv-row h3{font-size:23px}
 .inv-page .inv-battery-grid{grid-template-columns:1fr}
}
@media(max-width:700px){
 .inv-page .inv-setup-tabs{display:flex;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;border-radius:14px;max-width:100%}
 .inv-page .inv-setup-tab{white-space:nowrap;padding:9px 12px;font-size:12px}
 .inv-page .inv-setup-panel{padding:14px;border-radius:18px}
 .inv-page .inv-setup-copy h3{font-size:20px}
 .inv-page .inv-diagram{border-radius:14px}
 .inv-page .inv-label{font-size:9px;padding:1px 4px;border-radius:4px}
 .inv-page .inv-label.is-hub{font-size:9.5px;padding:2px 7px}
 .inv-page .inv-label.is-flow{font-size:8px;letter-spacing:.3px}
 .inv-page .inv-diagram-badge{left:8px;top:7px;font-size:9.5px;padding:3px 7px}
 /* Like the other product pages, keep the price near the first screen. */
 .inv-page .inv-stage{border-radius:14px;aspect-ratio:auto;height:210px;max-height:none}
 .inv-page .inv-thumbs{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:46px;gap:6px;margin-top:8px;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
 .inv-page .inv-thumb{border-radius:8px}
 .inv-page .inv-switch{margin-top:14px;gap:6px}
 .inv-page .inv-switch-option{padding:8px 9px}
 .inv-page .inv-switch-option[aria-current=page]{padding:7px 8px}
 .inv-page .inv-switch-kw{font-size:15px}
 .inv-page .inv-switch-option .live-price{font-size:10.5px}
 .inv-page .inv-loads{grid-template-columns:1fr 1fr}
 .inv-page .inv-calc-results{padding:16px}
 .inv-page .inv-total strong{font-size:36px}
 .inv-page .inv-size{grid-template-columns:50px 1fr;column-gap:10px;padding:8px}
 .inv-page .inv-mode-grid,.inv-page .inv-safety{grid-template-columns:1fr 1fr;gap:20px 16px}
 .inv-page .inv-row,.inv-page .inv-row:nth-child(even){grid-template-columns:1fr;gap:18px}
 .inv-page .inv-row:nth-child(even) figure{order:0}
 .inv-page .inv-row h3{font-size:21px}
 .inv-page .inv-stats strong{font-size:17px}
 .inv-page .inv-subhead{font-size:19px;margin-top:38px}
 .inv-page .inv-table{min-width:0;font-size:12px;table-layout:fixed}
 .inv-page .inv-table th,.inv-page .inv-table td{padding:10px 7px;overflow-wrap:anywhere}
 .inv-page .inv-table tbody th{width:26%}
 .inv-page .inv-table thead th{font-size:14px}
 .inv-page .inv-battery{grid-template-columns:64px 1fr;gap:12px}
 .inv-page .inv-battery-art{width:64px;height:64px}
 .inv-page .inv-battery-art img{width:54px;height:54px}
 .inv-page .inv-battery-buy{grid-column:1/-1;grid-template-columns:1fr auto;align-items:center;justify-items:start;text-align:left}
 .inv-page .inv-case-grid{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:72%;overflow-x:auto;gap:12px;scroll-snap-type:x mandatory;padding-bottom:6px}
 .inv-page .inv-case-grid figure{scroll-snap-align:start}
 .inv-page .inv-box{padding:20px}
}

/* Commercial pages, 29.9–80 kW (v8.201, scripts/store-ci-page.mjs). */
.inv-page .ci-switch{grid-template-columns:repeat(3,minmax(0,1fr))}
.inv-page .inv-range-link{display:flex;gap:9px;align-items:center;font-size:12.5px;font-weight:500;color:var(--blue);margin:8px 0 0;padding:9px 12px;border:1px solid #d6e2ea;border-radius:10px;background:#fff}
.inv-page .inv-range-link:hover{border-color:var(--blue);background:#f7fafc}
.inv-page .inv-range-link svg{width:16px;height:16px;flex-shrink:0}
.inv-page .inv-range-link span{flex:1}
.inv-page .purchase-document-note+.inv-licensed{margin-top:12px}
.inv-page .availability-badge{display:inline-block;font-size:12px;font-weight:600;color:#8a3a2b;background:#fbeceb;border:1px solid #f0c9c3;border-radius:999px;padding:3px 10px;margin-right:6px}
.inv-page .ci-proof{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 6px}
.inv-page .ci-proof p{display:flex;gap:10px;align-items:flex-start;margin:0;background:var(--pale);border-radius:12px;padding:12px 14px;font-size:12.5px;line-height:1.6;color:#35505f}
.inv-page .ci-proof svg{width:18px;height:18px;color:var(--blue);flex-shrink:0;margin-top:2px}
.inv-page .ci-proof a{color:var(--blue);text-decoration:underline;text-underline-offset:3px;white-space:nowrap;display:inline-flex;gap:3px;align-items:center}
.inv-page .ci-proof a svg{width:13px;height:13px;margin:0}
.inv-page .inv-calc .ci-hours{border:0;margin:24px 0 0;padding:0;min-width:0}
.inv-page .ci-network .document-note a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.inv-page .ci-network .document-note a svg{width:12px;height:12px;vertical-align:-1px;margin-left:2px}
.inv-page .ci-hours legend{font-size:14px;font-weight:500;margin-bottom:10px;padding:0}
.inv-page .ci-hour-options{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.inv-page .ci-hour{position:relative;display:block;cursor:pointer}
.inv-page .ci-hour input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.inv-page .ci-hour span{display:block;text-align:center;border:1px solid #c6d0d7;border-radius:10px;padding:10px 0;font-size:14px;font-weight:500;background:#fff}
.inv-page .ci-hour:hover span{border-color:var(--blue)}
.inv-page .ci-hour input:checked+span{border:2px solid var(--blue);padding:9px 0;background:var(--pale);color:var(--blue)}
.inv-page .ci-hour input:focus-visible+span{outline:3px solid #1e77b7;outline-offset:3px}
.inv-page .inv-size.is-parallel .inv-meter>span{background:var(--blue)}
.inv-page .inv-size.is-parallel .inv-size-status{color:var(--blue)}
.inv-page .ci-fit .inv-size{grid-template-columns:66px 1fr}
.inv-page .ci-fit .inv-size-kw{white-space:nowrap}
.inv-page .ci-enquire{font-size:10px;font-weight:600;border-radius:20px;padding:3px 8px;white-space:nowrap;color:#6b7f8c;background:#eef2f5}
.inv-page .inv-row figure.is-product{background:var(--surface);padding:22px}
.inv-page .inv-row figure.is-product img{mix-blend-mode:multiply;max-height:420px;width:auto;max-width:100%;margin:0 auto}
.inv-page .ci-bosg td strong{display:block;font-weight:500}
.inv-page .ci-bosg td small{display:block;font-weight:400;color:var(--muted);margin-top:2px}
.inv-page .ci-bosg tbody th small{display:block;font-size:10px;color:var(--muted);margin-top:3px;overflow-wrap:anywhere}
.inv-page .ci-battery .inv-battery-grid{margin-top:22px}
.inv-page .ci-network .inv-safety{margin-top:26px}
.inv-page .ci-need{display:flex;gap:28px;align-items:flex-end;justify-content:space-between;margin-top:30px;background:var(--surface);border-radius:16px;padding:24px 26px}
.inv-page .ci-need h3{display:flex;gap:9px;align-items:center;font-size:18px;font-weight:500;margin-bottom:14px}
.inv-page .ci-need h3 svg{color:var(--blue)}
.inv-page .ci-need .button{flex-shrink:0}
.inv-page .sc-roller rect{fill:#e4ebf0;stroke:#b3c2cc;stroke-width:1.5}
.inv-page .sc-roller path{stroke:#c3d0d8;stroke-width:1.2}
@media(max-width:700px){
 .inv-page .ci-proof{grid-template-columns:1fr}
 .inv-page .ci-need{flex-direction:column;align-items:stretch;padding:18px}
 .inv-page .ci-hour span{font-size:13px}
 .inv-page .ci-fit .inv-size{grid-template-columns:60px 1fr}
 .inv-page .inv-row figure.is-product{padding:14px}
}