.explanation-section{background:var(--paper);color:var(--ink)}.explanation-section .section-top,.safety-section .section-top{align-items:end;gap:8%}.explain-intro{max-width:440px;line-height:1.8;font-size:15px}.explainer{position:relative;background:#14252d;color:var(--paper);padding:35px;margin-top:30px}.explain-controls{display:flex;gap:8px;flex-wrap:wrap;padding-right:145px}.explain-controls button{background:transparent;border:1px solid #6d8088;color:var(--paper);padding:12px 15px;font-size:12px;cursor:pointer}.explain-controls button span{color:var(--orange);margin-right:9px;font-size:10px}.explain-controls button[aria-pressed=true]{background:var(--orange);color:var(--ink);border-color:var(--orange)}.explain-controls button[aria-pressed=true] span{color:var(--ink)}.explain-play{position:absolute;top:47px;right:35px;background:transparent;color:var(--paper);border:0;font-size:11px;cursor:pointer;border-bottom:1px solid #7c8b92;padding-bottom:6px}.diagram-node{text-align:center;min-width:0;position:relative;z-index:1}.diagram-node strong{display:block;font-size:16px;font-weight:500;margin:15px 0 8px}.diagram-node>span{display:block;color:#aabdc5;font-size:11px;line-height:1.6}.diagram-icon{height:65px;display:flex;align-items:center;justify-content:center;color:var(--orange);font-size:60px}.battery-outline{display:flex;flex-direction:column;gap:4px;width:42px;height:61px;border:2px solid var(--orange);padding:5px;border-radius:4px;position:relative}.battery-outline:before{content:'';position:absolute;top:-7px;left:10px;width:18px;border-top:4px solid var(--orange)}.battery-outline i{background:var(--orange);flex:1;opacity:.45}.battery-diagram{display:grid;grid-template-columns:1fr .65fr 1fr .7fr 1fr;align-items:center;gap:12px;padding:60px 0 45px}.flow-pipe{position:relative;height:2px;background:#6e87904d;margin-top:-50px}.flow-label{position:absolute;bottom:18px;left:-20%;right:-20%;text-align:center;font-size:10px;color:#aabdc5}.flow-pipe i{display:block;width:100%;height:3px;background:repeating-linear-gradient(90deg,var(--orange) 0 10px,transparent 10px 25px);opacity:.35}.meter-boundary{border-left:1px dashed #c0cbd4;min-height:140px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px}.meter-boundary span:first-child{font-size:10px}.meter-boundary i{width:29px;height:29px;border:1px solid var(--orange);border-radius:50%;background:linear-gradient(135deg,transparent 48%,var(--orange) 49%,var(--orange) 52%,transparent 53%)}.meter-boundary span:last-child{font-size:26px;color:var(--orange)}.step-caption{display:flex;gap:24px;border-top:1px solid #62798266;padding-top:26px;min-height:138px}.step-number{color:var(--orange);font-size:32px;font-family:Manrope,Arial}.step-caption h3{font-size:23px;margin:3px 0 10px}.step-caption p{font-size:14px;color:#bccbd0;line-height:1.8;max-width:780px;margin:0}.explain-note{font-size:11px;line-height:1.8;color:#7c8c92;margin:25px 0 0}.video-section{display:grid;grid-template-columns:.8fr 1.2fr;gap:8%;align-items:center}.video-heading h2{font-size:43px}.video-heading>p:last-child{color:#b8c7cd;line-height:1.8;font-size:15px}video{display:block;width:100%;aspect-ratio:16/9;background:#0b1319}.media-caption{font-size:11px;color:#aabdc5;line-height:1.8;margin-top:15px}.safety-section{background:#21353b}.safety-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:7%;align-items:start}.safety-grid details{margin:0}.safety-grid p{font-size:14px;line-height:1.8;color:#bdcbd1}.safety-grid summary,.equipment-grid summary,.solar-faq summary{font-size:16px;padding:22px 0}.safety-grid summary span,.solar-faq summary span{color:var(--orange)}.land-options{background:#21353b}.solar-diagram{position:relative;display:grid;grid-template-columns:1fr .7fr 1fr;grid-template-rows:145px 145px;gap:95px 25px;padding:55px 30px 45px}.garden-node{grid-area:1/1}.utility-node{grid-area:1/3}.enterprise-node{grid-area:2/1}.subscriber-node{grid-area:2/3}.electricity-flow{grid-area:1/2}.solar-connection{align-self:center;position:relative;height:3px;background:#68838e44}.solar-connection span{position:absolute;bottom:18px;left:-30%;right:-30%;text-align:center;font-size:11px;color:#aabdc5}.solar-connection i{display:block;height:3px;background:repeating-linear-gradient(90deg,var(--orange) 0 10px,transparent 10px 25px);opacity:.2}.vertical-flow{position:absolute;right:13%;top:200px;height:85px;border-left:2px dotted #6e8790}.vertical-flow span{position:absolute;left:10px;top:27px;white-space:nowrap;font-size:10px;color:#aabdc5}.payment-flow{right:24%}.payment-flow span{left:auto;right:10px}.vertical-flow i{display:block;position:absolute;left:-3px;width:4px;height:100%;background:repeating-linear-gradient(0deg,var(--orange) 0 8px,transparent 8px 20px);opacity:.2}.bill-symbol{position:relative;border:2px solid var(--orange);font:40px Arial;width:45px;height:58px}.bill-symbol small{font-size:18px;position:absolute;bottom:0;right:3px}.enterprise-node .battery-outline{border:0;transform:skew(-18deg);height:50px;width:45px;gap:6px}.enterprise-node .battery-outline:before{display:none}.enterprise-node .battery-outline i{opacity:1}.enterprise-node .battery-outline i:last-child{display:none}.billing-callout{border-left:3px solid #bc762e;padding:4px 0 4px 22px;margin-top:30px}.billing-callout strong{font-size:20px;font-weight:500}.billing-callout p{font-size:14px;line-height:1.8;max-width:850px;margin:10px 0 0}.bill-section{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}.bill-section>div>p:not(.eyebrow){font-size:15px;line-height:1.8;color:#bdcbd1}.sample-bill{background:var(--paper);color:var(--ink);padding:32px}.bill-top strong{font-size:22px;font-weight:500;display:block}.bill-top span{font-size:9px;letter-spacing:1px;color:#5e727b;display:block;margin-top:10px}.sample-bill dl{margin:28px 0 20px}.sample-bill dl>div{display:flex;justify-content:space-between;gap:20px;font-size:13px;padding:14px 0;border-bottom:1px solid #bdc9cb}.sample-bill dd{margin:0;white-space:nowrap}.sample-bill .credit{color:#286045}.sample-bill .bill-total{font-size:18px;font-weight:700;padding-top:22px}.bill-saving{display:flex;gap:22px;align-items:center}.bill-saving b{white-space:nowrap;font-size:19px}.bill-saving span{font-size:11px;line-height:1.7}.solar-site{background:var(--paper);color:var(--ink)}.equipment-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 50px;margin-top:40px}.equipment-grid p,.solar-faq p{font-size:14px;line-height:1.8;max-width:820px}.solar-faq p{color:#bdcbd1}.solar-faq details{margin-top:0}.solar-faq h2{margin-bottom:40px}
.explainer[data-state="1"] .battery-outline i{opacity:.9}.explainer[data-state="2"] .battery-outline i{opacity:.25}.explainer[data-state="1"] .battery-pipe i,.explainer[data-state="2"] .battery-pipe i{opacity:1}.explainer[data-state="0"] .electricity-flow i,.explainer[data-state="1"] .credit-flow i,.explainer[data-state="2"] .payment-flow i,.explainer[data-state="3"] .settlement-flow i{opacity:1}.explainer[data-state="3"] .settlement-flow span{color:var(--orange)}.explainer.in-view:not(.motion-off)[data-state="1"] .battery-pipe i{animation:flow-left 1.5s linear infinite}.explainer.in-view:not(.motion-off)[data-state="2"] .battery-pipe i,.explainer.in-view:not(.motion-off)[data-state="0"] .electricity-flow i{animation:flow-right 1.5s linear infinite}.explainer.in-view:not(.motion-off)[data-state="3"] .settlement-flow i{animation:flow-left 1.5s linear infinite}.explainer.in-view:not(.motion-off)[data-state="1"] .credit-flow i{animation:flow-down 1.5s linear infinite}.explainer.in-view:not(.motion-off)[data-state="2"] .payment-flow i{animation:flow-up 1.5s linear infinite}@keyframes flow-left{to{background-position:-25px 0}}@keyframes flow-right{to{background-position:25px 0}}@keyframes flow-down{to{background-position:0 20px}}@keyframes flow-up{to{background-position:0 -20px}}@media(max-width:900px){.explain-controls{padding-right:0}.explain-play{position:static;margin:20px 0 0}.battery-diagram{gap:8px}.diagram-node strong{font-size:14px}.video-section,.bill-section{gap:5%}.solar-diagram{padding-left:0;padding-right:0}.vertical-flow{right:10%}.payment-flow{right:27%}}@media(max-width:600px){.explanation-section .section-top,.safety-section .section-top{display:block}.explainer{padding:23px 18px}.explain-controls{gap:6px}.explain-controls button{font-size:11px;padding:10px}.explain-controls button span{margin-right:4px}.battery-diagram{grid-template-columns:1fr;gap:18px;padding:30px 0}.diagram-node strong{font-size:16px}.diagram-node>span{font-size:11px}.diagram-icon{height:55px}.battery-outline{height:51px}.battery-pipe{height:55px;width:2px;justify-self:center;margin:0}.battery-pipe i{width:3px;height:100%;background:repeating-linear-gradient(0deg,var(--orange) 0 8px,transparent 8px 20px)}.flow-label{left:15px;right:auto;bottom:12px;width:120px;text-align:left}.meter-boundary{border-left:0;border-top:1px dashed #c0cbd4;min-height:50px;width:80%;justify-self:center;flex-direction:row;padding-top:16px}.meter-boundary span:last-child{transform:rotate(90deg)}.step-caption{gap:14px;min-height:190px}.step-caption h3{font-size:20px}.step-caption p{font-size:13px}.step-number{font-size:26px}.video-section,.safety-grid,.bill-section{grid-template-columns:1fr;gap:30px}.video-heading h2{font-size:36px}.solar-diagram{grid-template-columns:1fr 36px 1fr;grid-template-rows:145px 145px;gap:105px 6px;padding-top:35px}.solar-diagram .diagram-node strong{font-size:13px}.solar-diagram .diagram-node>span{font-size:10px}.solar-connection span{font-size:9px;left:-30px;right:-30px;line-height:1.5}.vertical-flow{right:12%;top:190px;height:80px}.payment-flow{right:31%}.vertical-flow span{font-size:9px;top:5px;left:-5px;white-space:normal;width:60px;transform:translateX(-100%)}.payment-flow span{top:42px;right:-60px;left:auto;transform:none}.sample-bill{padding:24px 20px}.equipment-grid{grid-template-columns:1fr}.explain-intro{font-size:14px}.explainer.in-view:not(.motion-off)[data-state="1"] .battery-pipe i{animation:flow-up 1.5s linear infinite}.explainer.in-view:not(.motion-off)[data-state="2"] .battery-pipe i{animation:flow-down 1.5s linear infinite}}
@media(prefers-reduced-motion:reduce){.explainer *{animation:none!important}}

.settlement-flow{position:absolute;inset:0;pointer-events:none}.settlement-flow svg{width:100%;height:100%;overflow:visible}.settlement-flow path{fill:none;stroke:#6e879055;stroke-width:2}.settlement-flow .settlement-pulse{stroke:var(--orange);stroke-dasharray:10 15;opacity:.2}.settlement-flow .settlement-arrow{stroke:var(--orange);opacity:.2}.settlement-flow>span{position:absolute;top:50%;left:25%;font-size:10px;color:#aabdc5}.explainer[data-state="3"] .settlement-pulse,.explainer[data-state="3"] .settlement-arrow{opacity:1}.explainer.in-view:not(.motion-off)[data-state="3"] .settlement-pulse{animation:settlement 1.5s linear infinite}@keyframes settlement{to{stroke-dashoffset:-25}}@media(max-width:600px){.settlement-flow>span{left:5%;top:49%;font-size:9px;max-width:110px}}

/* Battery levels visibly track each transfer; paused animations retain their position. */
.explainer[data-explainer="battery"] .battery-outline{width:55px;height:76px;box-shadow:0 0 24px #f5ad6212}
.explainer[data-explainer="battery"] .battery-pipe{height:4px}
.explainer[data-explainer="battery"] .battery-pipe i{height:4px;background-size:25px 4px}
.explainer[data-explainer="battery"] .flow-label{font-size:12px;color:var(--orange)}
.explainer[data-explainer="battery"][data-state="1"] .battery-outline i{animation:store-energy 6.5s linear both}
.explainer[data-explainer="battery"][data-state="2"] .battery-outline i{opacity:1;animation:release-energy 1.5s linear both;animation-delay:var(--drain-at)}
.explainer[data-explainer="battery"] .battery-outline i:nth-child(1){--drain-at:0s;--fill-at:3s}
.explainer[data-explainer="battery"] .battery-outline i:nth-child(2){--drain-at:1.5s;--fill-at:2s}
.explainer[data-explainer="battery"] .battery-outline i:nth-child(3){--drain-at:3s;--fill-at:1s}
.explainer[data-explainer="battery"] .battery-outline i:nth-child(4){--drain-at:4.5s;--fill-at:0s}
.explainer[data-explainer="battery"][data-state="1"] .battery-outline i{animation-delay:var(--fill-at);animation-duration:2.5s}
.explainer[data-explainer="battery"].motion-off .battery-outline i{animation-play-state:paused}
.explainer[data-explainer="battery"][data-state="0"] .battery-outline{outline:1px solid #f5ad6266;outline-offset:7px}
@keyframes store-energy{from{opacity:.12}to{opacity:1}}
@keyframes release-energy{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(100% 0 0 0)}}
@media(max-width:600px){.explainer[data-explainer="battery"] .battery-pipe{height:55px;width:4px}.explainer[data-explainer="battery"] .battery-pipe i{height:100%;background-size:4px 20px}.explainer[data-explainer="battery"] .flow-label{font-size:11px}}

/* Large directional chevrons show electricity entering or leaving storage. */
.explainer[data-explainer="battery"] .battery-pipe{height:36px;background:transparent}
.power-chevron{display:block;width:100%;height:36px;overflow:hidden;color:var(--orange);opacity:.35}
.chevron-stream{fill:none;stroke:currentColor;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.explainer[data-explainer="battery"] .battery-pipe .flow-label{bottom:44px;line-height:1.5}
.explainer[data-state="1"] .power-chevron{transform:scaleX(-1);opacity:1}
.explainer[data-state="2"] .power-chevron{opacity:1}
.explainer[data-state="1"] .chevron-stream,.explainer[data-state="2"] .chevron-stream{animation:power-chevrons 1s linear infinite;animation-play-state:paused}
.explainer.in-view:not(.motion-off) .chevron-stream{animation-play-state:running}
@keyframes power-chevrons{to{transform:translateX(24px)}}
@media(max-width:600px){.explainer[data-explainer="battery"] .battery-pipe{width:100px;height:90px}.power-chevron{position:absolute;width:90px;height:36px;left:5px;top:27px;transform:rotate(90deg)}.explainer[data-state="1"] .power-chevron{transform:rotate(-90deg)}.explainer[data-explainer="battery"] .battery-pipe .flow-label{left:80px;bottom:27px;width:110px}}
@media(prefers-reduced-motion:reduce){.chevron-stream{animation:none!important}}
