/* A purpose-built, live SVG illustration of DOR's planned site architecture. */
.pe-power{--pe-ink:#14241d;--pe-green:#357048;--pe-bright:#80bd62;--pe-muted:#5d6b63;background:#fff;color:var(--pe-ink);padding:104px 0 64px;overflow:hidden;isolation:isolate}
.pe-inner{max-width:1440px;margin:0 auto;padding:0 var(--refresh-gutter,48px)}
.pe-heading{display:grid;grid-template-columns:1.15fr 1fr;gap:8%;align-items:end;margin-bottom:38px}
.pe-kicker{display:flex;align-items:center;gap:12px;font-family:var(--fm,monospace);font-size:11px;font-weight:450;letter-spacing:.085em;text-transform:uppercase;color:var(--pe-green);margin:0 0 23px}
.pe-kicker::before{content:"";display:block;width:28px;height:1px;background:currentColor}
.pe-heading h2{font-family:var(--fb,sans-serif);font-size:clamp(44px,5.3vw,76px);font-weight:550;line-height:1;letter-spacing:-.06em;margin:0;max-width:13ch;color:var(--pe-ink)}
.pe-heading h2 span{color:var(--pe-green)}
.pe-heading-copy{font-family:var(--fb,sans-serif);font-size:17px;line-height:1.65;color:var(--pe-muted);max-width:48ch;margin:0 0 3px}
.pe-console{border-top:1px solid #cad5cb;position:relative}
.pe-toolbar{display:flex;justify-content:space-between;align-items:center;gap:22px;padding:24px 0 0;position:relative;z-index:2}
.pe-mode-controls{display:flex;gap:4px;padding:4px;border:1px solid #d2ddd2;background:#e8eee6;border-radius:100px;max-width:100%}
.pe-mode-controls[hidden]{display:none}
.pe-mode{appearance:none;border:0;background:transparent;color:#526058;min-height:44px;padding:10px 24px;border-radius:100px;font-family:var(--fb,sans-serif);font-size:13px;font-weight:550;line-height:1.2;cursor:pointer;white-space:nowrap;transition:background .18s,color .18s,box-shadow .18s}
.pe-mode:hover{color:var(--pe-ink);background:#f5f7f3}
.pe-mode[aria-pressed="true"]{background:#fff;color:var(--pe-ink);box-shadow:0 2px 9px #14241d0d}
.pe-mode:focus-visible{outline:2px solid var(--pe-green);outline-offset:4px}

.pe-stage{position:relative;margin:0 -22px;min-width:0}
.pe-svg{width:100%;height:auto;display:block;overflow:visible}
.pe-svg-mobile{display:none}
.pe-symbols{position:absolute;width:0;height:0;overflow:hidden}
.pe-ground-line{stroke:#dce4da;stroke-width:1;fill:none}
.pe-wire{fill:none;stroke:#bacdb7;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pe-wire-halo{fill:none;stroke:#75ac66;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;opacity:.11}
.pe-flow{fill:none;stroke:#69a94e;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:9 37;animation:pe-current 1.6s linear infinite;animation-play-state:paused}
.pe-flow-secondary{stroke:#3a7850;stroke-dasharray:9 29;animation-name:pe-grid-current;animation-duration:1.9s}
.pe-flow-ev{animation-delay:-.28s}.pe-flow-factory{animation-delay:-.9s}.pe-flow-server{animation-delay:-.55s}
.pe-power.is-running .pe-flow{animation-play-state:running}
.pe-grid-flow,.pe-grid-status-on{opacity:0;transition:opacity .35s ease}
.pe-power[data-mode="grid"] .pe-grid-flow,.pe-power[data-mode="grid"] .pe-grid-status-on{opacity:1}
.pe-power[data-mode="grid"] .pe-grid-status-off{opacity:0}
.pe-grid-disconnected{opacity:0;transition:opacity .35s ease}
.pe-power[data-mode="island"] .pe-grid-disconnected{opacity:1}
.pe-grid-link{transition:opacity .35s ease}
.pe-power[data-mode="island"] .pe-grid-link{opacity:.3}
.pe-grid-art{transition:opacity .35s ease}
.pe-power[data-mode="island"] .pe-grid-art{opacity:.38}
.pe-signal-ring{fill:none;stroke:#6da956;stroke-width:1.2;opacity:.35;transform-box:fill-box;transform-origin:center;animation:pe-signal 3.2s ease-out infinite;animation-play-state:paused}
.pe-power.is-running .pe-signal-ring{animation-play-state:running}
.pe-signal-ring:nth-child(2){animation-delay:1.6s}
.pe-label{font-family:var(--fb,sans-serif);fill:#203b2b;font-size:16px;font-weight:550;letter-spacing:-.025em}
.pe-label-note{font-family:var(--fm,monospace);fill:#68776a;font-size:10px;letter-spacing:.04em}
.pe-caption-line{stroke:#aebdad;stroke-width:1;fill:none}
.pe-note-divider{stroke:#bdcdbb;stroke-width:1}
.pe-outlet-dot{fill:#75b25a;stroke:#fff;stroke-width:3}
.pe-caption{display:grid;grid-template-columns:.58fr 1.15fr 1fr;gap:42px;align-items:start;border-top:1px solid #cad5cb;padding-top:28px;position:relative}
.pe-caption-eyebrow{font-family:var(--fm,monospace);font-size:10px;letter-spacing:.065em;text-transform:uppercase;color:var(--pe-green);margin:3px 0 12px}
.pe-caption h3{font-size:23px;line-height:1.18;letter-spacing:-.035em;font-weight:550;margin:0;color:var(--pe-ink)}
.pe-caption-description{font-size:15px;line-height:1.65;color:#42564a;margin:0;max-width:49ch;min-height:5em}
.pe-destinations{padding:0;margin:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px 15px;font-size:12px;line-height:1.5;color:#49614e}
.pe-destinations li{display:flex;align-items:center;gap:7px}
.pe-destinations li::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:#72a960}
.pe-technical-link{display:inline-flex;align-items:center;min-height:44px;color:#357048;font-size:13px;font-weight:550;text-decoration:none;gap:13px;margin-top:9px}
.pe-technical-link:hover{text-decoration:underline;text-underline-offset:5px}
.pe-qualification{margin:28px 0 0;font-size:11px;line-height:1.65;color:#607064;max-width:115ch}
@keyframes pe-current{from{stroke-dashoffset:0}to{stroke-dashoffset:-92}}
@keyframes pe-grid-current{from{stroke-dashoffset:0}to{stroke-dashoffset:-76}}
@keyframes pe-signal{0%{opacity:.42;transform:scale(.88)}80%,100%{opacity:0;transform:scale(1.3)}}
@media(max-width:1050px){.pe-power{padding-top:76px}.pe-heading{gap:6%;grid-template-columns:1fr 1fr}.pe-heading h2{font-size:54px}.pe-heading-copy{font-size:15px}.pe-caption{grid-template-columns:.8fr 1.5fr;gap:28px}.pe-caption-context{grid-column:2}.pe-caption-description{min-height:0}.pe-stage{margin:0 -18px}.pe-mode{padding-inline:20px}}
@media(max-width:840px){.pe-power{padding-top:62px;padding-bottom:48px}.pe-inner{padding-inline:var(--refresh-gutter,24px)}.pe-heading{grid-template-columns:1fr;gap:22px;margin-bottom:27px}.pe-heading h2{font-size:clamp(44px,7.6vw,62px);max-width:15ch}.pe-kicker{font-size:10px;margin-bottom:18px}.pe-heading-copy{font-size:16px;max-width:49ch}.pe-toolbar{align-items:center;padding-top:19px;gap:15px;flex-wrap:wrap}.pe-mode-controls{flex:1;max-width:420px}.pe-mode{flex:1;padding-inline:15px}.pe-stage{margin:2px auto 0;max-width:600px}.pe-svg-desktop{display:none}.pe-svg-mobile{display:block}.pe-caption{grid-template-columns:1fr 1.6fr;gap:20px;padding-top:24px}.pe-caption h3{font-size:21px}.pe-caption-description{font-size:14px;line-height:1.65}.pe-caption-context{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px}.pe-technical-link{flex-shrink:0;margin-top:0}.pe-qualification{font-size:11px;margin-top:20px}}
@media(max-width:520px){.pe-toolbar{display:grid;grid-template-columns:1fr;gap:13px}.pe-mode-controls{width:100%;max-width:none}.pe-mode{font-size:12px;min-height:44px;padding:10px 9px}.pe-stage{margin-top:-12px;margin-inline:-10px}.pe-caption{grid-template-columns:1fr;gap:15px}.pe-caption-eyebrow{margin:0 0 9px}.pe-caption h3{font-size:23px}.pe-caption-description{font-size:15px;max-width:43ch}.pe-caption-context{grid-column:auto;display:block}.pe-destinations{font-size:11px;gap:7px 12px}.pe-technical-link{margin-top:6px}.pe-qualification{margin-top:18px}.pe-heading h2{font-size:clamp(43px,10.8vw,56px)}}
@media(prefers-reduced-motion:reduce){.pe-flow,.pe-signal-ring{animation:none!important}.pe-signal-ring{display:none}.pe-mode,.pe-grid-flow,.pe-grid-art,.pe-grid-disconnected,.pe-grid-link{transition:none}}

/* A generic site and four selected environments share the same power connections. */
.pe-site-controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid #d4dfd1}
.pe-site-controls[hidden]{display:none}
.pe-site{appearance:none;position:relative;display:flex;align-items:center;gap:12px;min-width:0;min-height:84px;padding:22px 18px 22px 0;border:0;background:#fff;color:#667363;font-family:var(--fb,sans-serif);font-size:14px;font-weight:500;line-height:1.4;text-align:left;cursor:pointer;transition:color .2s}
.pe-site+ .pe-site{padding-left:20px}
.pe-site:hover,.pe-site[aria-pressed="true"]{color:#234b31}
.pe-site:focus-visible{outline:2px solid var(--pe-green);outline-offset:-5px;border-radius:4px}
.pe-site-indicator{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#79a95d;transform-origin:left;transform:scaleX(0);transition:transform .3s ease,opacity .3s ease;opacity:0}
.pe-site[aria-pressed="true"] .pe-site-indicator{transform:scaleX(1);opacity:1}
.pe-mode-controls{background:#fff;padding:0;border:0;border-radius:0;gap:20px}
.pe-mode{padding:10px 0;border-radius:0;font-size:12px;color:#6d7967;box-shadow:none!important}
.pe-mode:hover{background:#fff}
.pe-mode[aria-pressed="true"]{color:#254f31;text-decoration:underline;text-decoration-color:#83a873;text-underline-offset:7px;text-decoration-thickness:1px}
.pe-toolbar{padding-top:17px}
.pe-stage{margin-top:4px}
.pe-site-scene{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .8s ease,visibility 0s .8s}
.pe-power[data-site="generic"] [data-pe-scene="generic"],.pe-power[data-site="edge"] [data-pe-scene="edge"],.pe-power[data-site="industry"] [data-pe-scene="industry"],.pe-power[data-site="ports"] [data-pe-scene="ports"],.pe-power[data-site="fleets"] [data-pe-scene="fleets"]{opacity:1;visibility:visible;transition-delay:0s}
.pe-site-purpose{font-size:13px;line-height:1.6;color:#49614e;margin:0;max-width:34ch;min-height:6.4em}
.pe-site-svg-label,.pe-site-svg-note,.pe-site-purpose{transition:opacity .5s ease}
.pe-power.is-changing-labels :is(.pe-site-svg-label,.pe-site-svg-note,.pe-site-purpose){opacity:0;transition-duration:.18s}
.pe-selection-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1050px){.pe-site{font-size:12px;gap:9px;padding-right:12px}.pe-site+ .pe-site{padding-left:12px}.pe-mode{padding-inline:0}.pe-site-purpose{max-width:45ch}}
@media(max-width:840px){.pe-site-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.pe-site{min-height:69px;font-size:13px;padding:17px 10px 17px 0}.pe-site+ .pe-site{padding-left:12px}.pe-site:nth-child(3){padding-left:0}.pe-site:nth-child(-n+2){border-bottom:1px solid #e4eae0}.pe-mode-controls{flex:0 1 auto;gap:21px}.pe-mode{flex:none;min-height:44px;padding:10px 0;font-size:12px}.pe-stage{margin-top:22px}.pe-caption-context{align-items:flex-start}.pe-site-purpose{max-width:37ch}}
@media(max-width:520px){.pe-toolbar{display:flex;justify-content:space-between;flex-wrap:nowrap;gap:10px}.pe-site{font-size:12px;gap:8px;min-height:70px}.pe-mode-controls{width:auto;gap:14px}.pe-mode{font-size:11px;padding:10px 0;white-space:nowrap}.pe-stage{margin-top:17px}.pe-caption-context{display:block}.pe-site-purpose{font-size:13px;max-width:40ch}}
@media(max-width:360px){.pe-toolbar{flex-wrap:wrap}.pe-site{font-size:11px;gap:6px}.pe-site+ .pe-site{padding-left:8px}.pe-site:nth-child(3){padding-left:0}}
@media(prefers-reduced-motion:reduce){.pe-site,.pe-site-indicator,.pe-power .pe-site-scene,.pe-site-svg-label,.pe-site-svg-note,.pe-site-purpose{transition:none!important}}

/* Power supply and supervisory control use distinct paths. */
.pe-control-link{fill:none;stroke:#7d8a82;stroke-width:1.5;stroke-dasharray:5 6;stroke-linecap:round}
.pe-power[data-mode="site"] .pe-grid-flow{opacity:1}
.pe-dor-art,.pe-dor-link{transition:opacity .3s}
.pe-power[data-mode="site"] .pe-dor-art{opacity:.2}
.pe-power[data-mode="site"] .pe-dor-link{opacity:0}
.pe-power[data-mode="island"] .pe-grid-link{opacity:0}
.pe-capacity{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:24px;align-items:center;padding:24px 0;border-top:1px solid #cad5cb}
.pe-capacity>div{display:flex;flex-direction:column;gap:10px}.pe-capacity>div>span{font-size:12px;color:#596860}.pe-capacity strong{font-size:clamp(26px,3vw,43px);letter-spacing:-.05em;font-weight:550;color:#14241d;line-height:1.15}.pe-capacity-total strong{color:#357048}.pe-math{font-size:23px;color:#647266}
.pe-legend{display:flex;gap:27px;padding:0 0 27px;font-size:11px;color:#596860;flex-wrap:wrap}.pe-legend>span{display:flex;align-items:center;gap:9px}.pe-legend i{display:block;width:22px;height:0;border-top:2px solid #69a94e}.pe-legend .pe-legend-control{border-top:1.5px dashed #7d8a82}
@media(max-width:600px){.pe-capacity{gap:10px;padding:20px 0}.pe-capacity>div>span{font-size:10px;min-height:28px}.pe-capacity strong{font-size:25px;white-space:nowrap}.pe-math{font-size:17px}.pe-legend{gap:16px;font-size:10px}.pe-svg-mobile{max-height:580px}}
@media(prefers-reduced-motion:reduce){.pe-dor-art,.pe-dor-link{transition:none}}

/* One clear configuration first; application scenes are optional depth. */
.pe-pause{border:0;background:transparent;color:#5d6b63;font:12px/1.4 var(--fb,sans-serif);min-height:44px;padding:8px 0 8px 15px;cursor:pointer;text-decoration:underline;text-underline-offset:4px;flex-shrink:0}
.pe-pause[hidden]{display:none}.pe-pause:focus-visible,.pe-application-options>summary:focus-visible{outline:2px solid #357048;outline-offset:4px}.pe-pause:disabled{cursor:default;text-decoration:none}
.pe-application-options{border-top:1px solid #dce2dd;margin-top:24px;padding-top:8px}.pe-application-options>summary{font-size:14px;color:#357048;cursor:pointer;min-height:44px;padding:12px 0;width:fit-content}.pe-application-options .pe-site-controls{border-bottom:0}.pe-caption{grid-template-columns:1fr 1.5fr}.pe-caption-context{grid-column:1/-1;display:flex;gap:24px;align-items:center;justify-content:space-between}.pe-site-purpose{min-height:0;max-width:55ch}.pe-caption-eyebrow{display:none}.pe-caption-description{min-height:0}.pe-power .pe-qualification{margin-top:20px}
@media(max-width:600px){.pe-caption{grid-template-columns:1fr}.pe-caption-context{grid-column:auto;display:block}.pe-pause{font-size:11px;padding-left:0}.pe-mode-controls{gap:12px}.pe-toolbar{gap:5px;flex-wrap:wrap}.pe-application-options .pe-site{font-size:12px}}

/* The network describes operating roles, independent of project size. */
.pe-capacity{grid-template-columns:repeat(3,minmax(0,1fr))}
.pe-capacity strong{font-size:clamp(20px,2.6vw,34px);white-space:normal;line-height:1.2}
@media(max-width:600px){.pe-capacity strong{font-size:18px}.pe-capacity>div>span{min-height:0}.pe-capacity{gap:12px}}

/* A single edge-site example; secondary applications retain general roles. */
.pe-power[data-site="edge"] .pe-capacity{grid-template-columns:1fr auto 1fr auto 1fr}
.pe-power[data-site="edge"] .pe-capacity strong{font-size:clamp(30px,4.2vw,58px);letter-spacing:-.05em;white-space:nowrap}
.pe-power:not([data-site="edge"]) .pe-math{display:none}
.pe-power[data-site="edge"] .pe-capacity>div>span{font-size:12px}
.pe-power .pe-heading h2{max-width:15ch}
@media(max-width:600px){.pe-power[data-site="edge"] .pe-capacity{gap:8px}.pe-power[data-site="edge"] .pe-capacity strong{font-size:clamp(24px,6.8vw,36px)}.pe-power[data-site="edge"] .pe-capacity>div>span{font-size:10px;min-height:26px}.pe-power .pe-math{font-size:16px}}
