.system-demo{margin:0;min-width:0;align-self:center;color:var(--ink,#24302b)}
.system-picture{position:relative;overflow:hidden;border-radius:4px 4px 44px 4px;background:#e6e0d5;isolation:isolate}
.system-picture>img{display:block!important;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:contain!important;object-position:50% 50%!important;filter:none!important;transform:none!important;border-radius:0!important}
.system-picture>video,.system-diagram{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none}
.system-picture>video{opacity:0;transition:opacity .2s ease;z-index:1}.system-has-video .system-picture>video{opacity:1}
.system-demo figcaption{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:15px 0 0;color:inherit;font-size:12px;line-height:1.45}
.system-caption{max-width:45ch}.system-toggle{flex:none;border:1px solid currentColor;border-radius:30px;color:inherit;background:transparent;font:inherit;padding:7px 13px;cursor:pointer;min-height:44px}
.system-toggle:hover{background:var(--ink,#24302b);color:var(--paper,#f3efe7)}.system-toggle:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.system-key{font-size:10px!important;margin:7px 0 0!important;opacity:.7;letter-spacing:.02em}
.system-hero{margin:25px 5vw 35px 0}.system-hero .system-picture{border-radius:4px 4px 80px 4px}
.technology-highlight-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.technology-highlights{padding-bottom:0}.service-row>.system-demo{width:100%}.service-row .system-picture{width:100%}
.system-diagram{z-index:2;fill:none;stroke:#c7e7dc;stroke-width:3;filter:drop-shadow(0 1px 2px #142c24);overflow:hidden}
.system-flow{stroke-dasharray:12 18;stroke-dashoffset:var(--signal-offset,0)}.system-node{fill:#b9ddcc;stroke:#f8fff9;stroke-width:2}.system-zone{fill:none;stroke-width:3;opacity:.5}
.system-audio{stroke:#f4dfac}.system-audio .system-zone{stroke-width:4}.system-climate .system-node{fill:none;stroke-width:2;opacity:.3}.system-temperature{font-family:Arial,sans-serif;font-size:32px;fill:white;stroke:none;filter:none}.system-supply{stroke:#b3e4e5;opacity:.15;transition:opacity .3s}.system-return{stroke:#e5cdb2;opacity:.15;transition:opacity .3s}.system-cooling .system-supply,.system-cooling .system-return{opacity:.9}.system-climate .system-flow{stroke-width:4;stroke-dasharray:16 18}
@media(max-width:700px){.system-hero{margin:0 6vw 28px}.system-hero .system-picture{border-radius:3px 3px 40px 3px}.technology-highlight-grid{grid-template-columns:1fr;gap:30px}.system-demo figcaption{font-size:11px;gap:10px;padding-top:11px}.system-toggle{padding:6px 11px;min-height:44px}.system-picture{border-radius:3px 3px 30px 3px}.system-diagram{stroke-width:4}}
@media(prefers-reduced-motion:reduce){.system-picture>video{display:none;transition:none}.system-supply,.system-return{transition:none}}

.system-security .system-detection-zone{stroke:#c4e5cf;stroke-width:3;stroke-dasharray:14 10;fill:#74ba8a09;opacity:.45}.system-record-light{fill:#d5e8dd;stroke:none;opacity:.4}.system-detected .system-detection-zone{opacity:1;fill:#74ba8a18}.system-detected .system-record-light{fill:#80e6a0;opacity:1}.system-event{position:absolute;z-index:3;bottom:14px;right:14px;padding:8px 12px;background:#18382ee8;border:1px solid #c4e5cf66;border-radius:30px;color:#f8f5ec;font-size:11px;opacity:0;transition:opacity .2s;pointer-events:none}.system-detected .system-event{opacity:1}@media(prefers-reduced-motion:reduce){.system-event{transition:none}}

/* Air paths remain legible over the pale architecture at phone size. */
.system-climate .system-supply{stroke:#44898c}.system-climate .system-return{stroke:#986f43}.system-climate .system-flow{stroke-width:5}

/* Group motion softness belongs to the people in the media; architecture stays sharp. */
