/* Monitoring, Energy and AI stories in the separate public review. */
.connected-delivery-page .delivery-demo .delivery-explanation { align-content: start; }
.connected-delivery-page .delivery-scope-ledger article > span { color: #766038; }
.monitor-example-section, .ai-example-section { background: #edf2f4; }
.energy-example-section { background: #f2efe8; }
.monitor-operation { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: 7%; align-items: center; }
.monitor-equipment { min-width: 0; }
.monitor-equipment > span { display: block; color: #52616c; font-size: 11px; }
.monitor-equipment h3 { font-size: 30px; line-height: 1.2; font-weight: 450; letter-spacing: -.03em; margin-top: 14px !important; }
.monitor-equipment img { display: block; width: 100%; max-width: 470px; height: auto; margin: 28px auto 20px; }
.monitor-equipment > p { font-size: 13px; line-height: 1.7; color: #52616c; max-width: 43ch; }
.monitor-signal { padding: 30px; border-radius: 18px; background: #102334; color: #fff; box-shadow: 0 20px 32px -28px #10233488; }
.monitor-signal-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-bottom: 22px; border-bottom: 1px solid #3a5060; }
.monitor-signal-heading strong { font-size: 14px; font-weight: 500; }
.monitor-signal-heading > span { font-size: 11px; color: #c4d1d9; }
.monitor-reading { margin-top: 25px; padding-left: 18px; border-left: 2px solid #5d7280; transition: border-color .4s; }
.monitor-reading > span { font-size: 11px; color: #d8c391; }
.monitor-reading h3 { font-size: 32px; font-weight: 450; letter-spacing: -.03em; line-height: 1.2; margin-top: 12px !important; }
.monitor-reading p { font-size: 13px; color: #c4d1d9; line-height: 1.7; margin-top: 12px !important; }
.monitor-context { margin: 26px 0 0; }
.monitor-context > div { display: grid; grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: 24px; padding: 18px 0; border-top: 1px solid #3a5060; }
.monitor-context dt { color: #c4d1d9; font-size: 11px; line-height: 1.7; }
.monitor-context dd { margin: 0; font-size: 13px; line-height: 1.7; }
.monitor-response { margin-top: 8px !important; padding: 16px 18px; border: 1px solid #526773; border-radius: 9px; color: #e1e9ed; font-size: 12px; line-height: 1.6; transition: border-color .4s; }
.monitor-demo:has([aria-controls="monitor-0"][aria-pressed="true"]) .monitor-reading { border-color: #d8c391; }
.monitor-demo:has([aria-controls="monitor-1"][aria-pressed="true"]) .monitor-context > div { border-color: #a3926d; }
.monitor-demo:has([aria-controls="monitor-2"][aria-pressed="true"]) .monitor-response { border-color: #d8c391; }
.connected-delivery-note { color: #52616c; font-size: 12px; line-height: 1.8; max-width: 90ch; border-top: 1px solid #cdd6d8; padding-top: 24px; margin-top: 36px !important; }

.energy-demand { background: #fff; padding: 28px 30px 24px; border: 1px solid #d6d9d1; border-radius: 16px; }
.energy-demand-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px 24px; }
.energy-demand-heading h3 { color: #52616c; font-size: 12px; line-height: 1.4; font-weight: 400; }
.energy-demand-heading strong { display: block; font-size: 38px; line-height: 1.1; font-weight: 400; letter-spacing: -.035em; margin-top: 6px; }
.energy-demand-heading strong > span { color: #66737b; font-size: 18px; }
.energy-demand-heading > span { color: #52616c; font-size: 11px; line-height: 1.6; text-align: right; }
/* Keep the plot wide and its labels legible at every size; only SVG geometry scales. */
.energy-demand-plot { position: relative; height: 160px; margin: 18px 4px 0 30px; }
.energy-demand-chart { display: block; width: 100%; height: 100%; overflow: visible; }
.energy-demand-chart path { vector-effect: non-scaling-stroke; }
.energy-chart-scale { position: absolute; inset: 0 auto 0 -30px; width: 21px; }
.energy-chart-scale > span { position: absolute; right: 0; transform: translateY(-50%); }
.energy-chart-scale > span:nth-child(2) { top: 50%; }
.energy-chart-scale > span:last-child { top: 100%; }
.energy-chart-times { position: relative; height: 16px; margin: 10px 4px 0 30px; }
.energy-chart-times > span { position: absolute; }
.energy-chart-times > span:nth-child(2) { left: 33.333%; transform: translateX(-50%); }
.energy-chart-times > span:nth-child(3) { left: 66.667%; transform: translateX(-50%); }
.energy-chart-times > span:last-child { right: 0; }
.energy-chart-scale, .energy-chart-times { color: #66737b; font-size: 11px; line-height: 16px; font-variant-numeric: tabular-nums; }
.energy-chart-hours { fill: #f2eee4; }
.energy-chart-grid { stroke: #e2e8ea; stroke-width: 1; fill: none; }
.energy-chart-curve { stroke: #102334; stroke-width: 2.7; stroke-linecap: round; stroke-linejoin: round; fill: none; }
.energy-chart-after-hours { stroke: #947c4d; stroke-width: 2.7; fill: none; stroke-linecap: round; }
.energy-chart-point { position: absolute; right: 0; top: 51.25%; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: #947c4d; transform: translate(50%, -50%); }
.energy-chart-legend { display: flex; flex-wrap: wrap; gap: 10px 24px; font-size: 11px; color: #52616c; margin-top: 16px; }
.energy-chart-legend > span { display: inline-flex; align-items: center; gap: 10px; }
.energy-chart-legend i { display: inline-block; width: 20px; height: 2px; background: #102334; }
.energy-chart-legend .energy-hours-key { height: 12px; background: #f2eee4; border: 1px solid #c7baa0; }
.energy-chart-legend .energy-after-key { background: #947c4d; height: 3px; }
.energy-example-context { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; margin-top: 28px; }
.energy-example-context > div { border-top: 2px solid #cdd6d8; padding-top: 19px; transition: border-color .4s; }
.energy-example-context span { color: #766038; font-size: 10px; }
.energy-example-context h3 { font-size: 20px; font-weight: 450; line-height: 1.3; margin-top: 12px !important; }
.energy-demo:has([aria-controls="energy-0"][aria-pressed="true"]) [data-energy-context="0"],
.energy-demo:has([aria-controls="energy-1"][aria-pressed="true"]) [data-energy-context="1"],
.energy-demo:has([aria-controls="energy-2"][aria-pressed="true"]) [data-energy-context="2"] { border-color: #766038; }
.energy-data { border-top: 1px solid #d7dcd7; margin-top: 28px; }
.energy-data summary { cursor: pointer; padding-block: 14px; min-height: 48px; font-size: 12px; color: #52616c; }
.energy-data table { width: 100%; border-collapse: collapse; font-size: 13px; }
.energy-data caption { text-align: left; color: #52616c; line-height: 1.7; font-size: 12px; padding: 8px 0 15px; }
.energy-data :is(th, td) { text-align: left; padding: 10px 16px 10px 0; border-bottom: 1px solid #d7dcd7; }
.energy-data th { font-weight: 500; }
.energy-evidence-map { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: 24px 12%; align-items: center; margin-top: 50px !important; }
.energy-evidence-sources { padding: 0; list-style: none; margin: 0; }
.energy-evidence-sources li { padding: 21px 0; border-top: 1px solid #3a5060; }
.energy-evidence-sources span { color: #d8c391; font-size: 10px; }
.energy-evidence-sources h3 { font-size: 25px; font-weight: 450; letter-spacing: -.025em; margin-top: 14px !important; line-height: 1.3; }
.energy-evidence-sources p { color: #bdcbd4; font-size: 14px; line-height: 1.7; margin-top: 12px !important; max-width: 42ch; }
.energy-report { position: relative; isolation: isolate; background: #fff; color: #102334; border-radius: 12px; padding: 32px; box-shadow: 12px 12px 0 #6c7b83; margin: 0 12px 12px 0; }
.energy-report > span { color: #766038; font-size: 11px; }
.energy-report h3 { font-size: 36px; font-weight: 450; letter-spacing: -.04em; line-height: 1.1; margin-top: 20px !important; }
.energy-report > p { color: #52616c; font-size: 13px; line-height: 1.7; margin-top: 15px !important; }
.energy-report dl { margin: 28px 0 0; }
.energy-report dl > div { padding-block: 15px; border-top: 1px solid #d9e1e5; }
.energy-report dt { color: #766038; font-size: 10px; }
.energy-report dd { margin: 9px 0 0; font-size: 13px; line-height: 1.7; }
.energy-evidence-map > figcaption { grid-column: 1 / -1; color: #bdcbd4; font-size: 11px; line-height: 1.7; margin-top: 24px; }

.ai-workbench { display: grid; grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1.08fr); gap: 28px; align-items: center; }
.ai-context-source { display: grid; gap: 26px; }
.ai-context-source article { border-left: 2px solid #bacbd3; padding: 8px 0 8px 24px; transition: border-color .4s; }
.ai-context-source article > span { color: #766038; font-size: 10px; text-transform: uppercase; letter-spacing: .06em; }
.ai-context-source blockquote { font-size: 25px; line-height: 1.45; letter-spacing: -.025em; margin: 18px 0 0; }
.ai-context-source h3 { font-size: 24px; line-height: 1.3; font-weight: 450; letter-spacing: -.025em; margin-top: 17px !important; }
.ai-context-source p { color: #52616c; font-size: 13px; line-height: 1.7; margin-top: 10px !important; }
.ai-workbench-connector { color: #766038; font-size: 30px; font-weight: 300; text-align: center; }
.ai-proposal-sheet { background: #fff; padding: 32px; border: 1px solid #c3d2d9; border-radius: 16px; box-shadow: 0 18px 32px -26px #10233455; transition: border-color .4s, transform .6s; }
.ai-proposal-sheet > span { color: #766038; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.ai-proposal-sheet h3 { font-size: 34px; font-weight: 450; letter-spacing: -.035em; line-height: 1.15; margin-top: 20px !important; }
.ai-proposal-sheet > p { font-size: 14px; color: #52616c; line-height: 1.75; margin-top: 18px !important; }
.ai-proposal-tasks { padding: 0; margin: 23px 0 0; list-style: none; }
.ai-proposal-tasks li { border-top: 1px solid #d9e1e5; padding: 15px 0 0; margin-top: 15px; color: #52616c; font-size: 13px; line-height: 1.7; }
.ai-proposal-tasks span { color: #766038; margin-right: 12px; font-size: 10px; }
.ai-context-demo:has([aria-controls="ai-0"][aria-pressed="true"]) .ai-context-source article { border-color: #766038; }
.ai-context-demo:has([aria-controls="ai-1"][aria-pressed="true"]) .ai-proposal-sheet { border-color: #766038; transform: translateY(-3px); }
.ai-public-options { margin-top: 12px; }
.ai-public-options .solution-public-choice { align-items: center; min-height: 48px; padding-block: 12px; border-bottom: 1px solid #cdd6d8; cursor: pointer; line-height: 1.6; }
.ai-public-options input { flex: 0 0 auto; }
.ai-public-options .solution-public-choice:focus-within { outline: 2px solid #766038; outline-offset: 4px; }
.connected-use-cases { margin-top: 48px; }
.connected-use-cases article { display: grid; grid-template-columns: 40px minmax(0, 1fr) minmax(0, .8fr); gap: 5%; padding-block: 30px; border-top: 1px solid #3a5060; align-items: center; }
.connected-use-cases article > span { color: #d8c391; font-size: 11px; align-self: start; }
.connected-use-cases h3 { font-size: 28px; font-weight: 450; line-height: 1.2; letter-spacing: -.03em; }
.connected-use-cases p { color: #bdcbd4; font-size: 14px; line-height: 1.75; margin-top: 16px !important; max-width: 46ch; }
.connected-case-flow { list-style: none; margin: 0; padding: 0; color: #dce5eb; font-size: 12px; }
.connected-case-flow li { padding-block: 10px; border-bottom: 1px solid #3a5060; }
.connected-case-flow li + li::before { content: "↓"; color: #d8c391; display: inline-block; margin-right: 12px; }

@media (max-width: 1100px) {
  .monitor-operation { gap: 5%; }
  .monitor-signal { padding: 25px; }
  .monitor-context > div { gap: 18px; }
  .energy-evidence-map { column-gap: 7%; }
  .ai-workbench { gap: 20px; grid-template-columns: minmax(0, 1fr) 28px minmax(0, 1.08fr); }
  .ai-proposal-sheet { padding: 27px; }
  .ai-proposal-sheet h3 { font-size: 29px; }
  .ai-context-source blockquote { font-size: 23px; }
}
@media (max-width: 820px) {
  .monitor-equipment h3 { font-size: 26px; }
  .monitor-reading h3 { font-size: 28px; }
  .monitor-signal-heading { flex-wrap: wrap; gap: 10px; }
  .monitor-context > div { grid-template-columns: 1fr; gap: 7px; }
  .energy-demand { padding: 24px; }
  .energy-example-context { gap: 24px; }
  .energy-example-context h3 { font-size: 19px; }
  .energy-report { padding: 26px; }
  .energy-report h3 { font-size: 31px; }
  .energy-evidence-sources h3 { font-size: 23px; }
  .ai-context-source article { padding-left: 20px; }
  .ai-context-source blockquote { font-size: 21px; }
  .ai-proposal-sheet { padding: 24px; }
  .ai-proposal-sheet h3 { font-size: 27px; }
  .connected-use-cases article { grid-template-columns: 30px minmax(0, 1fr) minmax(0, .72fr); gap: 4%; }
  .connected-use-cases h3 { font-size: 25px; }
  .connected-case-flow { font-size: 11px; }
}
@media (max-width: 600px) {
  .monitor-operation { grid-template-columns: 1fr; gap: 28px; }
  .monitor-equipment img { max-width: 320px; margin-block: 22px 16px; }
  .monitor-signal { padding: 24px; }
  .monitor-context > div { grid-template-columns: minmax(0, .75fr) minmax(0, 1.25fr); gap: 18px; }
  .energy-demand { padding: 22px 16px 18px; border-radius: 12px; }
  .energy-demand-heading { gap: 9px; }
  .energy-demand-heading h3 { font-size: 11px; }
  .energy-demand-heading > span { font-size: 10px; }
  .energy-demand-plot { height: 140px; }
  .energy-chart-legend { gap: 12px 18px; font-size: 10px; }
  .energy-example-context { grid-template-columns: 1fr; gap: 23px; }
  .energy-example-context > div { display: grid; grid-template-columns: 75px minmax(0, 1fr); gap: 8px 20px; padding-top: 18px; }
  .energy-example-context span { grid-column: 1; line-height: 1.7; padding-top: 3px; }
  .energy-example-context h3 { grid-column: 2; margin-top: 0 !important; font-size: 21px; }
  .energy-evidence-map { grid-template-columns: 1fr; gap: 24px; margin-top: 30px !important; }
  .energy-report { max-width: 440px; padding: 28px 24px; }
  .energy-evidence-map > figcaption { margin-top: 0; }
  .ai-workbench { grid-template-columns: 1fr; gap: 22px; }
  .ai-context-source { gap: 22px; }
  .ai-context-source blockquote { font-size: 25px; }
  .ai-workbench-connector { transform: rotate(90deg); justify-self: start; margin-left: 12px; }
  .ai-proposal-sheet { padding: 26px; border-radius: 14px; }
  .ai-proposal-sheet h3 { font-size: 31px; }
  .connected-use-cases { margin-top: 30px; }
  .connected-use-cases article { grid-template-columns: 1fr; gap: 18px; padding-block: 28px; }
  .connected-use-cases h3 { font-size: 27px; }
  .connected-case-flow { margin-top: 3px; font-size: 12px; }
}
@media (max-width: 359px) {
  .monitor-context > div { grid-template-columns: 1fr; gap: 7px; }
  .energy-example-context > div { grid-template-columns: 64px minmax(0, 1fr); gap: 8px 14px; }
  .ai-proposal-sheet { padding: 22px; }
}