[hidden]{display:none!important}
:root{scroll-behavior:auto}
.intro,.farm-preview{animation:none}
.opening{background:#001335}
.site-header{position:relative;z-index:4;gap:1.5rem}
.site-nav{gap:1.45rem;margin-inline-start:auto}
#effects-toggle{display:flex;align-items:center;gap:.55rem;padding:.5rem .7rem;border:1px solid #8bc7e54d;border-radius:8px;background:transparent;color:#c0d8ec;font-size:.78rem;min-height:44px;flex-shrink:0}
#effects-toggle svg{width:15px;height:15px}
.hero{min-height:690px;grid-template-columns:minmax(0,.72fr) minmax(0,1.3fr);gap:1rem;padding-block:2rem 5rem}
.intro{z-index:2;position:relative;padding-bottom:2rem}
.intro h1{font-size:clamp(4.3rem,7vw,7rem);line-height:1.12;margin-bottom:1.8rem}
.title-line{display:block}
.title-line:first-child{font-size:.59em;color:#d8ebf7;line-height:1.7}
.intro>p{font-size:1.15rem;max-width:34ch}
.hero-visual{min-width:0;position:relative;height:580px;isolation:isolate}
.flow-canvas,.flow-fallback{position:absolute;inset:-10% -6%;width:112%;height:120%;z-index:-1;pointer-events:none}
.flow-fallback{fill:none;stroke:#3db9d7;stroke-width:1.4;opacity:.7}
.flow-canvas.is-ready+.flow-fallback{display:none}
.hero-visual .farm-preview{position:absolute;inset-inline-start:2%;bottom:6%;width:91%;transform-origin:center;perspective:1200px}
.farm-image{padding:8px;background:#12345b;box-shadow:0 35px 85px #0005;border:1px solid #8ce2f72e}
.farm-image img{border-radius:7px}
.preview-action{padding:.6rem .6rem .2rem;font-size:.83rem}
.farm-preview figcaption{font-size:.78rem}
.flow-caption{position:absolute;top:9%;inset-inline-end:7%;display:flex;gap:.7rem;align-items:center;color:#c8eaf7;font-size:.84rem}
.flow-caption i{display:block;height:1px;width:48px;background:#65d3d3}
.waterline{opacity:.4;height:45px}
.signal-story{background:#001335;color:#fff;border-top:1px solid #45719838;padding-block:2rem 4rem}
.signal-shell{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.25fr);gap:2rem;align-items:center;min-height:660px}
.signal-copy h2{font-size:clamp(2.5rem,4.5vw,4.2rem);line-height:1.35}
.story-description{color:#a9c9df;font-size:.92rem;margin-top:1rem}
.signal-steps{display:grid;margin-top:2rem;gap:.35rem}
.signal-step{display:flex;text-align:start;align-items:start;gap:1rem;padding:1rem .6rem;color:#9ebed7;background:transparent;border:0;border-radius:8px;min-height:82px;position:relative;transition:background-color .3s,color .3s}
.signal-step:disabled{cursor:default}
.signal-step strong{display:block;font-size:1.05rem;color:inherit;font-weight:700}
.signal-step>span>span{display:block;font-size:.85rem;margin-top:.3rem}
.step-index{font-size:.85rem;border:1px solid #547e9c;border-radius:50%;display:grid;place-items:center;min-width:28px;height:28px;margin-top:.2rem;flex-shrink:0}
.signal-step[aria-pressed=true]{color:#e9f8ff;background:#12456c55}
.signal-step[aria-pressed=true] .step-index{background:#98e9e3;color:#002d41;border-color:#98e9e3}
.signal-story :focus-visible{outline-color:#8de4ff}
.signal-visual{min-width:0;position:relative;isolation:isolate}
.signal-orbit{position:absolute;inset:7% 9%;border-radius:50%;background:radial-gradient(ellipse,#16466b69,transparent 70%);z-index:-1}
.network-art{width:100%;height:auto;display:block;stroke-width:1;stroke:none;overflow:visible}
.field-contours{stroke:#5681a2;stroke-width:1;opacity:.28}
.network-base{stroke:#173e63;stroke-width:15;stroke-linecap:round}
.network-flow{stroke:url(#pipe-gradient);stroke-width:2;stroke-linecap:round;opacity:.9}
.water-packets{stroke:#d0fdff;stroke-width:5;stroke-linecap:round;stroke-dasharray:8 270;opacity:.85}
.sector-nodes>g>circle:first-child{fill:#052747;stroke:#5093b5;stroke-width:1.5}
.node-core{fill:#8ce3df;stroke:none}
.sector-nodes text{fill:#a9cddd;font-family:'Plex Arabic',Arial,sans-serif;font-size:21px;text-anchor:middle}
.center-node>circle:first-child{fill:#03223e;stroke:#60c5d4;stroke-width:1.2}
.center-node>circle:nth-child(2){fill:#082c4e;stroke:#224e70;stroke-width:1}
.signal-alert{fill:none;stroke:#ffbd75;stroke-width:2}
.alert-ring-outer{opacity:.35}
.inspection-route{stroke:#b7f5ee;stroke-width:3;stroke-dasharray:7 8;stroke-linecap:round}
.inspection-target{fill:none;stroke:#d6fffa;stroke-width:3}
.signal-state{position:relative;margin-inline:auto;margin-top:-.65rem;display:flex;align-items:center;gap:.7rem;min-height:56px;width:92%;padding:1rem 1.15rem;background:#0d3152;border:1px solid #5884a342;border-radius:10px;font-size:.9rem}
.signal-state-dot{width:7px;height:7px;border-radius:50%;background:#91e4dc;flex-shrink:0}
.signal-counter{margin-inline-start:auto;font-size:.74rem;color:#99bbd3;direction:ltr}
.signal-drawing-note{display:block;font-size:.72rem;color:#94b5cf;text-align:center;margin-top:.6rem}
.signal-story.story-motion-enabled{height:220svh;padding-block:0}
.story-motion-enabled .signal-shell{position:sticky;top:0;min-height:min(100svh,1000px);height:100svh;max-height:1000px}
.cad-theatre{margin-top:2rem}
.cad-stage{overflow:hidden;background:#e7f0f6;border-radius:18px;border:1px solid #dce7ec}
.cad-stage-link{display:block;position:relative;aspect-ratio:1.95;background:#eef4f8;overflow:hidden}
.cad-stage-link>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;padding:2rem 4rem;mix-blend-mode:multiply}
#cad-stage-next{opacity:0;pointer-events:none}
.stage-expand{position:absolute;inset-inline-end:1rem;top:1rem;display:flex;gap:.45rem;align-items:center;color:#174d6a;background:#ffffffd9;border-radius:8px;padding:.4rem .6rem;min-height:44px;font-size:.8rem}
.stage-expand svg{width:18px;height:18px}
.cad-scan{position:absolute;inset-inline-start:0;top:0;width:3px;height:100%;opacity:0;background:#34b9b0;pointer-events:none}
.cad-stage-meta{background:#fff;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.3rem 1.6rem}
.cad-stage-meta h3{font-size:1.25rem}
.cad-stage-meta p{font-size:.9rem;color:#46617a;margin-top:.3rem}
.cad-stage-count{font-size:.85rem;direction:ltr;color:#385a72}
.cad-view-controls{display:flex;justify-content:center;align-items:stretch;flex-wrap:wrap;gap:.6rem;padding-top:1.3rem}
.cad-view-controls button{padding:.65rem 1.2rem;min-height:48px;border:1px solid #b6cddb;border-radius:9px;background:transparent;color:#284e6b;font-size:.92rem}
.cad-view-controls button[aria-pressed=true]{background:#001742;border-color:#001742;color:white}
.cad-view-status{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(hover:hover) and (pointer:fine){.signal-step:not(:disabled):hover{color:#fff;background:#16496955}.cad-view-controls button:not([aria-pressed=true]):hover{background:#dcecf5}#effects-toggle:hover{background:#214e7255}}
@media(max-width:1100px){.site-header{gap:.9rem}.site-nav{gap:.8rem}.site-nav a{font-size:.8rem}.brand{gap:.8rem}.brand>span{padding-inline-start:.8rem}.hero{grid-template-columns:minmax(0,.65fr) minmax(0,1.2fr)}.hero-visual{height:530px}.intro>p{font-size:1.05rem}.signal-shell{gap:1rem}.signal-state{font-size:.8rem}.signal-step{gap:.7rem}}
@media(max-width:850px){.site-header{flex-wrap:wrap;justify-content:space-between}.site-nav{order:3;width:100%;margin:0;justify-content:space-between;gap:.3rem .8rem}.site-nav a{font-size:.82rem}.hero{grid-template-columns:minmax(0,1fr);gap:0;padding-top:2rem;padding-bottom:2.5rem;min-height:0}.intro{padding-bottom:0}.intro h1{font-size:clamp(3.7rem,14vw,6rem);line-height:1.1;margin-bottom:1.2rem}.title-line{display:inline}.title-line:first-child{font-size:inherit;color:white;line-height:inherit}.intro>p{font-size:1.07rem;max-width:44ch}.hero-visual{height:clamp(350px,64vw,500px);margin-top:1.2rem}.hero-visual .farm-preview{width:96%;bottom:7%;inset-inline-start:0}.flow-canvas,.flow-fallback{inset:-6% -4%;width:108%;height:110%}.flow-caption{top:5%;inset-inline-end:3%;font-size:.78rem}.signal-story{padding-block:2.6rem 3.5rem}.signal-shell{grid-template-columns:minmax(0,1fr);min-height:0;gap:.5rem}.signal-copy h2{font-size:2.3rem}.signal-copy h2 br{display:none}.signal-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;margin-top:1.4rem}.signal-step{display:block;padding:.85rem .65rem;min-height:0}.step-index{margin-bottom:.5rem;width:28px}.signal-step strong{font-size:.87rem}.signal-step>span>span{font-size:.75rem}.signal-visual{margin-top:.5rem}.signal-state{bottom:-.35rem;padding:.8rem;font-size:.8rem;min-height:52px}.signal-drawing-note{margin-top:1.4rem}.cad-stage-link{aspect-ratio:1.5}.cad-stage-link>img{padding:1.3rem .6rem}.cad-stage-meta{padding:1rem;align-items:start}.cad-stage-meta h3{font-size:1.05rem}.cad-stage-meta p{font-size:.82rem}.cad-stage-count{font-size:.72rem}.cad-view-controls{gap:.45rem}.cad-view-controls button{padding:.5rem .7rem;font-size:.8rem;min-height:46px}}
@media(max-width:370px){.site-nav a{font-size:.74rem}.site-nav{gap:.1rem .3rem}#effects-toggle{font-size:.7rem;padding:.4rem .5rem}.intro h1{font-size:3.45rem}.hero-visual{height:310px}.signal-copy h2{font-size:2.05rem}.signal-steps{gap:.2rem}.signal-step{padding:.7rem .45rem}.signal-step strong{font-size:.78rem}.signal-step>span>span{font-size:.71rem}.signal-state{font-size:.72rem;padding:.55rem}.cad-view-controls button{font-size:.73rem;padding:.5rem .55rem}.cad-stage-meta{gap:.5rem}.cad-stage-meta h3{font-size:.95rem}}
@media(prefers-reduced-motion:reduce){.hero-visual .farm-preview{transform:none!important}.signal-step{transition:none}}