/* R2: one shared isometric industrial site, lit from upper left. */
.energy-showcase{--e-text:#e6f1f3;--e-muted:#b0c8d3;--e-accent:#60e4d7;--e-panel:#102d41;background:#071b2b;color:var(--e-text);padding:64px 0 40px;scroll-margin-top:80px}
.energy-inner{max-width:1200px;margin:auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 300px;column-gap:20px;row-gap:20px}.energy-copy{grid-column:1/-1;display:flex;justify-content:space-between;gap:32px;align-items:end}.energy-eyebrow{font-size:14px;color:var(--e-accent);margin:0 0 12px}.energy-copy h2{font-size:46px;line-height:1.08;letter-spacing:-.035em;margin:0;font-weight:700}.energy-lead{max-width:610px;font-size:17px;line-height:1.55;color:var(--e-muted);margin:16px 0 0}.energy-actions{display:flex;gap:10px;flex-wrap:wrap;padding-bottom:4px}.energy-actions a{min-height:48px;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:12px 16px;border:1px solid #7697a8;border-radius:5px;color:var(--e-text);font-size:15px;text-decoration:none;font-weight:600}.energy-actions .energy-primary{background:var(--e-accent);color:#071b2b;border-color:var(--e-accent)}.energy-actions a:hover{filter:brightness(1.15)}
.energy-system{min-width:0;position:relative}.energy-toolbar{display:flex;justify-content:space-between;gap:12px;font-size:14px;color:var(--e-muted);padding-top:16px}.energy-toolbar strong{color:var(--e-accent);font-weight:500}.energy-stage{margin:-10px -32px -32px;position:relative}.energy-scene{width:100%;height:auto;display:block;overflow:visible}.energy-route{stroke:#547284;opacity:.4;stroke-dasharray:5 8}.energy-route.is-active{stroke:var(--e-accent);opacity:1;stroke-dasharray:9 10;animation:energy-current 2.5s linear infinite}.scene-equipment .node-light{opacity:.2}.scene-equipment.is-active .node-light{opacity:1;filter:drop-shadow(0 0 6px #60e4d7)}.factory-light{opacity:.25}.scene-factory.is-active .factory-light{opacity:1;filter:drop-shadow(0 0 4px #60e4d7)}.energy-rotor{transform-origin:0 0;animation:energy-spin var(--wind-period,14s) linear infinite;animation-play-state:paused}[data-node="wind"].is-active .energy-rotor{animation-play-state:running}.energy-source-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;position:relative}.energy-source{border-top:2px solid #3b596a;padding:10px 0;font-size:14px;line-height:1.5;min-width:0}.energy-source span{display:block;color:var(--e-muted)}.energy-source strong{display:block;font-size:15px;font-weight:500;color:var(--e-muted);font-variant-numeric:tabular-nums}.energy-source.is-active{border-color:var(--e-accent)}.energy-source.is-active strong{color:var(--e-accent)}
.energy-mobile{align-self:center;justify-self:center;perspective:none}.energy-phone{width:276px;box-sizing:border-box;background:linear-gradient(135deg,#15344a,#081c2d 55%);border:2px solid #799aaa;border-right:5px solid #36566b;border-bottom:5px solid #36566b;border-radius:32px;padding:12px 18px 16px;box-shadow:inset 2px 0 1px #c2dcdf66,16px 24px 22px #0005,0 0 0 5px #071521;transform:none;line-height:1.35}.energy-speaker{width:48px;height:5px;border-radius:4px;background:#051421;margin:0 auto 14px;box-shadow:0 1px 0 #7195a3}.energy-phone-head{display:flex;gap:9px;align-items:center}.energy-phone-head img{width:38px;height:38px;object-fit:contain;border-radius:6px}.energy-phone-head strong{display:block;font-size:15px}.energy-phone-head span{display:block;font-size:14px;color:var(--e-muted)}.energy-phone-status{display:flex;justify-content:space-between;gap:8px;margin:18px 0 12px;font-size:14px}.energy-phone-status>span{color:var(--e-muted)}.energy-phone-status strong{color:var(--e-accent)}.energy-consumption>span{display:block;font-size:14px;color:var(--e-muted)}.energy-consumption>strong{display:block;font-size:46px;font-weight:600;line-height:1.1;letter-spacing:-.04em;margin:6px 0}.energy-consumption small{font-size:18px;color:var(--e-muted);letter-spacing:0}.energy-consumption b{font-weight:400}.energy-alarm{font-size:14px;line-height:1.4;color:var(--e-accent);margin:12px 0 8px}.energy-phone-foot{font-size:14px;color:var(--e-muted);margin:0}
.energy-controls{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr auto;gap:24px;align-items:center;background:var(--e-panel);padding:16px 20px;border:1px solid #2c4b5c;border-radius:12px}.energy-controls label{font-size:14px;min-width:0}.energy-controls output{float:right;color:var(--e-accent)}.energy-controls input{display:block;accent-color:var(--e-accent);width:100%;height:44px;cursor:pointer;margin:0}.energy-control-buttons{display:flex;gap:10px}.energy-controls button{min-height:44px;font:inherit;font-size:14px;color:var(--e-text);background:#1a3b50;border:1px solid #799bab;padding:10px 14px;border-radius:6px;cursor:pointer;touch-action:manipulation}.energy-controls button:first-child{border-color:var(--e-accent)}.energy-controls button:hover{background:#30586e}.energy-showcase :is(a,button,input,summary):focus-visible{outline:3px solid #fff;outline-offset:4px;scroll-margin:100px}.energy-foot{grid-column:1/-1}.energy-note,.energy-foot details{font-size:14px;color:var(--e-muted);line-height:1.6}.energy-note{margin:0}.energy-foot summary{min-height:44px;align-content:center;width:fit-content;cursor:pointer;color:var(--e-text)}.energy-foot details p{max-width:960px}.energy-showcase[data-outage="true"] [data-energy="status"],.energy-showcase[data-outage="true"] .energy-alarm{color:#edbd78}.energy-showcase[data-outage="true"] [data-line="grid"]{stroke:#edbd78}
@keyframes energy-current{to{stroke-dashoffset:-38}}@keyframes energy-spin{to{transform:rotate(360deg)}}.energy-showcase[data-motion="paused"] :is(.energy-route,.energy-rotor){animation-play-state:paused!important}
@media(max-width:1100px){.energy-inner{grid-template-columns:minmax(0,1fr) 270px;gap:20px 8px}.energy-copy{align-items:start}.energy-copy h2{font-size:40px}.energy-actions{max-width:210px}.energy-phone{width:254px;padding:12px 14px 14px}.energy-controls{grid-template-columns:1fr 1fr}.energy-control-buttons{grid-column:1/-1;justify-content:end}.energy-stage{margin:20px -20px 0}.energy-source-list{grid-template-columns:1fr 1fr;gap:4px 16px}.energy-system{align-self:center}}
@media(max-width:600px){.energy-showcase{padding:40px 0 28px}.energy-inner{padding:0 16px;grid-template-columns:minmax(0,1fr);gap:20px}.energy-copy{display:block}.energy-copy h2{font-size:34px}.energy-lead{font-size:16px;margin-top:12px}.energy-eyebrow{margin-bottom:10px}.energy-actions{max-width:none;margin-top:20px;padding:0;flex-wrap:nowrap}.energy-actions a{font-size:14px;padding:10px 12px;gap:8px;flex:1;min-height:48px}.energy-toolbar{padding:0}.energy-stage{margin:-4px -12px -12px}.energy-source-list{gap:0 16px}.energy-source{padding:7px 0;display:flex;justify-content:space-between;gap:6px}.energy-source strong{font-size:14px}.energy-phone{width:262px;transform:none}.energy-mobile{margin:4px 0 0}.energy-controls{grid-template-columns:1fr 1fr;gap:10px 16px;padding:14px}.energy-control-buttons{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr;gap:10px}.energy-controls button{padding:10px 8px}.energy-foot{margin-top:0}}
@media(max-width:359px){.energy-inner{padding:0 12px}.energy-copy h2{font-size:30px}.energy-source{display:block}.energy-toolbar{font-size:14px}.energy-phone{width:254px}.energy-controls{gap:10px}.energy-actions a{padding:10px}.energy-lead{font-size:16px}}
@media(prefers-reduced-motion:reduce){.energy-showcase :is(.energy-route,.energy-rotor){animation:none!important}.energy-phone{transform:none}}
/* Screenshot review: keep the controls in the desktop composition. */
.energy-showcase{padding-top:40px;padding-bottom:28px}.energy-inner{row-gap:16px}.energy-copy h2{font-size:42px}.energy-stage{margin:-6px -20px -12px}.energy-scene{height:424px}.energy-phone{line-height:1.25;padding:10px 16px 12px}.energy-speaker{margin-bottom:10px}.energy-phone-status{margin:12px 0 8px}.energy-consumption>strong{font-size:40px;margin:4px 0}.energy-alarm{margin:10px 0 6px}.scene-equipment[data-node="solar"]{filter:brightness(calc(.65 + var(--source-level, .65) * .35))}.energy-route.is-active{opacity:calc(.45 + var(--source-level, 1) * .55)}
@media(max-width:1100px) and (min-width:601px){.energy-copy h2{font-size:38px}.energy-stage{margin:8px -12px 0}.energy-scene{height:auto}.energy-controls{row-gap:8px}.energy-source{padding:7px 0}.energy-phone{padding-left:14px;padding-right:14px}}
@media(max-width:600px){.energy-copy h2{font-size:34px}.energy-scene{height:auto}.energy-stage{margin:-4px -12px -12px}.energy-inner{row-gap:16px}.energy-showcase{padding-top:36px}}
@media(max-width:359px){.energy-copy h2{font-size:30px}}

/* R4: a short single line, HTML labels retain their actual text size. */
.energy-phone{padding:10px 14px 12px;line-height:1.3}
.energy-phone-head{gap:8px}.energy-phone-head img{width:28px;height:28px;border-radius:4px}
.energy-phone-status{margin:8px 0 4px;min-height:19px;display:block}.energy-phone-status strong{font-size:14px;font-weight:500}
.energy-consumption>strong{margin:2px 0 8px;font-size:42px}
.energy-single-line{position:relative;height:200px;margin:0 0 8px;font-size:14px;line-height:1.3}
.energy-single-line svg{position:absolute;inset:0;width:100%;height:200px;overflow:visible}
.mini-wire,.mini-switch,.mini-arrow{fill:none;stroke:#8ba6b5;stroke-width:1.5;vector-effect:non-scaling-stroke}
.mini-wire{stroke-dasharray:3 3}.mini-wire.is-active{stroke:#60e4d7;stroke-dasharray:5 4;animation:mini-current 1.8s linear infinite}
.mini-switch.is-active,.mini-arrow.is-active{stroke:#60e4d7}.mini-arrow{visibility:hidden}.mini-arrow.is-active{visibility:visible}
.mini-label{position:absolute;left:0;width:43%;text-align:center;background:#0b2233;border:1px solid #7697a8;border-radius:3px;font-size:14px;line-height:18px;min-height:20px;color:var(--e-text)}
.mini-label.is-active{border-color:#60e4d7}.mini-label span{display:block;color:var(--e-muted);font-variant-numeric:tabular-nums}
.mini-grid{top:0}.mini-trafo{top:44px}.mini-ats{top:84px}.mini-ats span{display:inline;color:inherit}.mini-ag{top:136px}.mini-load{top:180px}
.mini-branch{position:absolute;right:0;width:46%;font-size:14px;color:var(--e-text);text-align:center;line-height:18px}
.mini-branch>span{display:block;color:var(--e-muted);font-variant-numeric:tabular-nums}
.mini-branch.is-active>span:not(.mini-protection){color:var(--e-accent)}
.mini-generator{top:38px}.mini-renewables{top:102px}.mini-branch>.mini-name{color:var(--e-text)}.mini-protection{margin-top:2px}
.energy-readings{display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;font-size:14px;margin:0;padding-top:7px;border-top:1px solid #345163}
.energy-readings>div{display:flex;justify-content:space-between;gap:4px;align-items:baseline}.energy-readings .energy-daily{grid-column:1/-1}
.energy-readings dt{color:var(--e-muted);font-size:14px}.energy-readings dd{margin:0;font-size:14px;font-variant-numeric:tabular-nums;white-space:nowrap}
.energy-readings>div:not(.energy-daily){display:block}.energy-readings>div:not(.energy-daily) dt{display:none}
.energy-readings>div:not(.energy-daily) dd:before{content:'AG · ';color:var(--e-muted)}
.energy-alarm{margin:8px 0 4px;min-height:36px;font-size:14px;line-height:18px}
.energy-phone-foot{font-size:14px;line-height:18px;color:var(--e-muted)}
@keyframes mini-current{to{stroke-dashoffset:-18}}
.energy-showcase[data-motion="paused"] .mini-wire{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.energy-showcase .mini-wire{animation:none!important}}

/* STO-85 v4: simulation uses the existing CTA button language. */
.energy-action-block{flex-shrink:0}
.energy-simulation-link{box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:48px;margin-top:12px;width:100%;padding:12px 16px;border:1px solid var(--e-accent);border-radius:5px;background:var(--e-panel);color:var(--e-text);font-size:15px;font-weight:600;text-decoration:none;scroll-margin-top:100px}
.energy-simulation-link:hover{filter:brightness(1.15)}
.energy-simulation-link:focus-visible{outline:3px solid white;outline-offset:4px}
.energy-new-tab{display:block;margin-top:6px;color:#b0c8d3;font-size:12px}
@media(max-width:700px){.energy-action-block{width:100%}}
@media(max-width:600px){.energy-simulation-link{font-size:14px;padding:10px 12px;gap:8px}}
