:root{--ink:#102d3b;--blue:#123f57;--cyan:#24a9ba;--light:#edf6f7;--orange:#ef8b3a;--muted:#607984;--line:#d4e4e7;--white:#fff;--shadow:0 18px 55px #123f5715}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7fafb;color:var(--ink);font:16px/1.7 "Segoe UI","Microsoft YaHei",sans-serif}a{color:inherit}.wrap{width:min(1160px,calc(100% - 40px));margin:auto}.site-header{position:sticky;top:0;z-index:20;background:#ffffffed;border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.nav{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;font-weight:850;color:var(--blue)}.brand b{color:var(--cyan)}.nav-links{display:flex;gap:22px}.nav-links a{text-decoration:none;font-size:14px;color:var(--muted)}.nav-links a.active,.nav-links a:hover{color:var(--cyan)}.nav-toggle{display:none;background:white;border:1px solid var(--line);border-radius:8px;padding:8px 12px}.hero{padding:84px 0;background:linear-gradient(120deg,#fff 0 65%,#dff2f4 65%)}.hero-visual{min-height:660px;display:flex;align-items:center;color:white;background:linear-gradient(90deg,#071e2de8 0%,#0b304cb8 38%,#123f571e 70%),url("environment-monitoring-hero.jpg") center/cover no-repeat}.hero-visual h1,.hero-visual p{color:white}.eyebrow,.demo{font-size:12px;letter-spacing:.16em;font-weight:800;color:var(--cyan);text-transform:uppercase}.hero h1{font-size:clamp(42px,6vw,76px);line-height:1.06;max-width:850px;margin:16px 0}.hero p{max-width:670px;font-size:19px;color:var(--muted)}.actions{display:flex;gap:12px;margin-top:28px}.btn{display:inline-block;padding:12px 20px;border-radius:7px;text-decoration:none;font-weight:750;background:var(--cyan);color:white}.btn.alt{background:white;color:var(--blue)}section{padding:72px 0}h2{font-size:clamp(30px,4vw,48px);line-height:1.15;margin:8px 0 30px;color:var(--blue)}h3{color:var(--blue)}.lead{max-width:760px;color:var(--muted)}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.grid.two{grid-template-columns:repeat(2,1fr)}.card{background:white;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:var(--shadow)}.metric{font-size:38px;font-weight:850;color:var(--blue)}.metric small{font-size:14px;color:var(--muted)}.status{display:inline-flex;align-items:center;gap:8px;color:#13816f;font-weight:750}.status:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor}.dark{background:var(--blue);color:#d8e8ed}.dark h2,.dark h3{color:white}.flow{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;align-items:center}.node{min-height:120px;display:grid;place-items:center;text-align:center;background:white;border:1px solid var(--line);border-radius:12px;padding:18px;font-weight:750;color:var(--blue);position:relative}.node:not(:last-child):after{content:"→";position:absolute;right:-18px;color:var(--cyan);z-index:2;font-size:24px}.alert{border-left:4px solid var(--orange)}.list{display:grid;gap:12px}.row{display:flex;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line);padding:12px 0}.tag{font-size:12px;color:#14715f;background:#e3f4ef;padding:3px 9px;border-radius:99px}.map{min-height:320px;position:relative;overflow:hidden;background:linear-gradient(25deg,#dfede7 0 34%,#cfe7ec 34% 50%,#edf4e9 50%);isolation:isolate}.map:before,.map:after{content:"";position:absolute;inset:10% -8%;border:2px solid #fff9;border-radius:50%;transform:rotate(-12deg)}.map:after{inset:-15% 30%;transform:rotate(40deg)}.pin{position:absolute;left:58%;top:48%;z-index:2;width:22px;height:22px;background:var(--orange);border:5px solid white;border-radius:50% 50% 50% 0;transform:rotate(-45deg)}.map-label{position:absolute;left:calc(58% + 25px);top:43%;z-index:2;background:white;padding:8px 12px;border-radius:8px;font-weight:800}.site-footer{padding:40px 0;background:#0b2635;color:#bdd0d7}.footer{display:flex;justify-content:space-between;gap:24px}.site-footer a{color:white}:focus-visible{outline:3px solid var(--orange);outline-offset:3px}@media(max-width:800px){.nav-toggle{display:block}.nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:white;padding:20px;flex-direction:column;border-bottom:1px solid var(--line)}.nav-links.open{display:flex}.hero{padding:58px 0;background:white}.hero-visual{min-height:560px;background:linear-gradient(#071e2dd9,#123f578f),url("environment-monitoring-hero.jpg") 62% center/cover no-repeat}.grid,.grid.two,.flow{grid-template-columns:1fr}.node:not(:last-child):after{content:"↓";right:auto;bottom:-23px}.footer{flex-direction:column}.actions{flex-wrap:wrap}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}