@font-face{font-family:"Antonio";font-weight:500;font-display:swap;src:url(../fonts/antonio-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Antonio";font-weight:600;font-display:swap;src:url(../fonts/antonio-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Antonio";font-weight:700;font-display:swap;src:url(../fonts/antonio-latin-700-normal.woff2) format("woff2")}
@font-face{font-family:"Hind";font-weight:400;font-display:swap;src:url(../fonts/hind-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Hind";font-weight:500;font-display:swap;src:url(../fonts/hind-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"B612 Mono";font-weight:400;font-display:swap;src:url(../fonts/b612-mono-latin-400-normal.woff2) format("woff2")}

:root{
  --blue:#0b3d91;--deep:#082a66;--deeper:#061e4d;--ink:#eaf3ff;--dim:rgba(234,243,255,.74);--faint:rgba(234,243,255,.2);
  --hot:#ffc98a;--cold:#9fd8ff;--vellum:#f1f5fb;--navy:#0a2a66;--navy2:#33508a;
  --disp:"Antonio","Arial Narrow",sans-serif;--body:"Hind",system-ui,sans-serif;--mono:"B612 Mono",ui-monospace,monospace;
  --gut:clamp(16px,3.2vw,48px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
body{background:var(--blue);color:var(--ink);font:400 17px/1.55 var(--body);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit}
img,svg{display:block;max-width:100%}
.skip{position:fixed;left:8px;top:-60px;z-index:100;background:var(--ink);color:var(--navy);padding:8px 14px;font-family:var(--mono)}
.skip:focus{top:8px}
:focus-visible{outline:2px solid var(--hot);outline-offset:3px}
.mono{font-family:var(--mono);letter-spacing:.04em}
.disp{font-family:var(--disp);text-transform:uppercase}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--gut);pointer-events:none}
.top>*{pointer-events:auto}
.top{transition:background .3s,box-shadow .3s}
.top.bar{background:rgba(6,30,77,.94);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(234,243,255,.25)}
.mark{display:flex;align-items:center;gap:10px;text-decoration:none;font:700 24px/1 var(--disp);letter-spacing:.14em;text-transform:uppercase}
.mark svg{width:30px;height:30px;flex:none}
.mark small{display:none;font:400 11px/1 var(--mono);letter-spacing:.12em;color:var(--dim);border-left:1px solid var(--faint);padding-left:10px;text-transform:uppercase}
.top nav{display:none;gap:26px;font:400 13px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase}
.top nav a{text-decoration:none;padding:6px 0;border-bottom:1px solid transparent}
.top nav a:hover{border-color:var(--hot)}
.call{font:600 16px/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border:1.5px solid var(--ink);padding:10px 14px 9px;background:rgba(8,42,102,.7);backdrop-filter:blur(6px);white-space:nowrap}
.call:hover{background:var(--ink);color:var(--navy)}
@media(min-width:900px){.top nav{display:flex}.mark small{display:block}}

/* the sheet */
.sheet{position:relative;height:1000vh;background:var(--blue)}
.stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--blue)}
.dwg{position:absolute;inset:0;width:100%;height:100%;--u:1}
.frame{position:absolute;inset:10px;border:1px solid rgba(234,243,255,.5);pointer-events:none}
.frame::before{content:"";position:absolute;inset:6px;border:1px solid var(--faint)}
.frame i{position:absolute;font:400 10px/1 var(--mono);color:var(--dim);letter-spacing:.1em}
.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 60% 50%,transparent 45%,rgba(6,30,77,.55) 100%)}

/* svg drawing styles */
.dwg *{vector-effect:none}
.grid-minor{stroke:rgba(234,243,255,.07);stroke-width:calc(var(--u) * 1px)}
.grid-major{stroke:rgba(234,243,255,.15);stroke-width:calc(var(--u) * 1px)}
.part{fill:none;stroke:var(--ink);stroke-width:calc(var(--u) * 1.6px);stroke-linecap:round;stroke-linejoin:round}
.part.thin,.thin{stroke-width:calc(var(--u) * 1px);stroke:rgba(234,243,255,.7)}
.part .dr{stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.6s cubic-bezier(.5,0,.2,1) forwards;animation-delay:calc(var(--d,0) * 1s)}
.part .fillable{fill:rgba(8,42,102,.85)}
@keyframes draw{to{stroke-dashoffset:0}}
.ground{fill:url(#hatch);opacity:.9}
.ghost{fill:none;stroke:rgba(234,243,255,.28);stroke-width:calc(var(--u) * 1.2px);stroke-dasharray:calc(var(--u) * 5px) calc(var(--u) * 6px)}
.pipe{fill:none;stroke-width:calc(var(--u) * 3px);stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.run.c .pipe{stroke:var(--ink)}
.run.h .pipe{stroke:var(--hot)}
.flow{fill:none;stroke-width:calc(var(--u) * 3px);stroke-linecap:round;stroke-dasharray:calc(var(--u) * 7px) calc(var(--u) * 17px);opacity:0;transition:opacity .6s}
.run.c .flow{stroke:#2a7fd6}
.run.h .flow{stroke:#d9731a}
.run.on .flow{opacity:1;animation:flow 1.1s linear infinite}
.run.rev.on .flow{animation-direction:reverse}
@keyframes flow{to{stroke-dashoffset:calc(var(--u) * -24px)}}
.pen{fill:var(--ink);opacity:0}
.pen-ring{fill:none;stroke:var(--ink);stroke-width:calc(var(--u) * 1px)}
.note{opacity:0}
.note .ln{fill:none;stroke:var(--ink);stroke-width:calc(var(--u) * 1px);stroke-dasharray:1;stroke-dashoffset:1}
.note .dot{fill:var(--ink)}
.ring{fill:none;stroke:var(--hot);stroke-width:calc(var(--u) * 1.5px);transform-box:fill-box;transform-origin:center;animation:ring 2.2s ease-out infinite}
@keyframes ring{0%{transform:scale(.6);opacity:1}100%{transform:scale(2.2);opacity:0}}
.drip{fill:var(--cold);opacity:0}
.tapsOn .drip{animation:drip 1.4s ease-in infinite}
@keyframes drip{0%{transform:translateY(0);opacity:0}15%{opacity:1}80%{transform:translateY(30px);opacity:1}100%{transform:translateY(34px);opacity:0}}
.pulse{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{50%{opacity:.45}}

/* cards */
.cards{position:absolute;inset:0;pointer-events:none}
.card{position:absolute;left:var(--gut);top:84px;width:min(440px,calc(100% - var(--gut) * 2));padding:22px 24px 24px;background:rgba(8,42,102,.9);backdrop-filter:blur(8px);border:1px solid rgba(234,243,255,.55);opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .45s,transform .45s,visibility 0s .45s}
.card.on{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .45s .08s,transform .45s .08s,visibility 0s}
.card::before,.card::after{content:"";position:absolute;width:12px;height:12px;border:2px solid var(--hot)}
.card::before{left:-2px;top:-2px;border-right:0;border-bottom:0}
.card::after{right:-2px;bottom:-2px;border-left:0;border-top:0}
.card.hero{width:min(600px,calc(100% - var(--gut) * 2));top:50%;transform:translateY(calc(-50% + 14px))}
.card.hero.on{transform:translateY(-50%)}
.kick{display:flex;justify-content:space-between;gap:12px;font:400 12px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--hot);margin-bottom:12px}
.kick span:last-child{color:var(--dim)}
.card h1,.card h2{font:700 clamp(38px,4.4vw,60px)/.98 var(--disp);text-transform:uppercase;letter-spacing:.005em}
.card.hero h1{font-size:clamp(50px,7.2vw,100px);line-height:.94;letter-spacing:-.005em}
.card h1 em,.card h2 em{font-style:normal;color:var(--hot)}
.card p{margin-top:14px;color:var(--ink);max-width:46ch}
.card .kick{max-width:none;margin-top:0}
.card .spec{margin-top:16px;border-top:1px solid var(--faint);font:400 12px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.card .spec div{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid var(--faint)}
.card .spec b{font-weight:400;color:var(--hot);text-align:right}
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.btn{display:inline-flex;align-items:center;gap:10px;font:600 18px/1 var(--disp);letter-spacing:.1em;text-transform:uppercase;text-decoration:none;padding:13px 18px 12px;border:1.5px solid var(--ink);transition:background .2s,color .2s}
.btn.solid{background:var(--ink);color:var(--navy)}
.btn:hover{background:var(--hot);border-color:var(--hot);color:var(--navy)}
.more{display:inline-block;margin-top:16px;font:400 12px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--hot);text-decoration:none;border-bottom:1px solid var(--hot);padding-bottom:3px}

/* title block */
.titleblock{position:absolute;right:22px;bottom:22px;display:grid;grid-template-columns:auto auto auto;border:1px solid rgba(234,243,255,.6);background:rgba(8,42,102,.92);font:400 11px/1.25 var(--mono);letter-spacing:.08em;text-transform:uppercase;pointer-events:none}
.titleblock div{padding:7px 12px;border-right:1px solid var(--faint);min-width:96px}
.titleblock div:last-child{border:0}
.titleblock small{display:block;font-size:9px;color:var(--dim);margin-bottom:3px}
.titleblock .wide{min-width:210px}
.titleblock b{font-weight:400;color:var(--ink)}
.progress{position:absolute;left:22px;bottom:22px;width:min(440px,40vw);font:400 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);display:none}
.progress i{display:block;height:2px;background:var(--faint);margin-top:8px;position:relative}
.progress i b{position:absolute;inset:0 auto 0 0;width:0;background:var(--hot)}
@media(min-width:900px){.progress{display:block}}
.scrollhint{position:absolute;right:calc(var(--gut) + 6px);top:50%;writing-mode:vertical-rl;font:400 11px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--dim);transition:opacity .4s;display:none}
@media(min-width:900px){.scrollhint{display:block}}

@media(max-width:899px){
  .titleblock{display:none}
  .card{left:12px;right:12px;top:auto;bottom:12px;width:auto;padding:16px 16px 18px;transform:translateY(14px)}
  .card.hero{top:auto;transform:translateY(14px);width:auto}
  .card.hero.on{transform:none}
  .card h1,.card h2{font-size:clamp(34px,10vw,48px)}
  .card.hero h1{font-size:clamp(44px,13.5vw,66px)}
  .card p{font-size:15.5px;margin-top:10px}
  .card .spec{display:none}
  .btns{margin-top:14px}
  .btn{font-size:16px;padding:11px 14px 10px}
  .kick{margin-bottom:8px;font-size:10.5px;white-space:nowrap}
  .card.hero .kick span:last-child{display:none}
}
@media(max-height:620px) and (min-width:900px){.card p{font-size:15px}.card .spec{display:none}}

/* sections after the sheet */
.vellum{position:relative;background:var(--vellum);color:var(--navy);padding:clamp(72px,10vw,150px) var(--gut)}
.vellum::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(10,42,102,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(10,42,102,.07) 1px,transparent 1px);background-size:24px 24px}
.wrap{position:relative;max-width:1320px;margin:0 auto}
.sec-head{display:grid;gap:16px;margin-bottom:clamp(32px,5vw,64px)}
.sec-head .tag{font:400 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--navy2)}
.blue .sec-head .tag{color:var(--hot)}
.sec-head h2{font:700 clamp(46px,8vw,120px)/.88 var(--disp);text-transform:uppercase;letter-spacing:-.005em}
.sec-head h2 em{font-style:normal;color:#b8590f}
.blue .sec-head h2 em{color:var(--hot)}
.sec-head p{max-width:54ch;font-size:19px}
@media(min-width:900px){.sec-head{grid-template-columns:1.1fr 1fr;align-items:end}.sec-head .tag{grid-column:1/-1}}

.sched{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.sched caption{text-align:left;font:400 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--navy2);padding-bottom:12px}
.sched th{font:400 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;text-align:left;padding:10px 12px;border-top:2px solid var(--navy);border-bottom:1px solid var(--navy);color:var(--navy2)}
.sched td{padding:18px 12px;border-bottom:1px solid rgba(10,42,102,.28);vertical-align:baseline}
.sched td:first-child{font:400 14px/1 var(--mono);color:var(--navy2);width:80px}
.sched td:nth-child(2){font:700 clamp(26px,3.4vw,44px)/1 var(--disp);text-transform:uppercase;letter-spacing:.01em}
.sched td:nth-child(2) small{display:block;font:400 15px/1.4 var(--body);text-transform:none;letter-spacing:0;color:var(--navy2);margin-top:6px;max-width:48ch}
.sched td:nth-child(3){font:400 14px/1.3 var(--mono);white-space:nowrap}
.sched td:last-child{font:700 clamp(24px,2.6vw,34px)/1 var(--disp);text-align:right;white-space:nowrap}
.sched tr{transition:background .25s}
.sched tbody tr:hover{background:rgba(10,42,102,.05)}
@media(max-width:700px){.sched td:nth-child(3){display:none}.sched th:nth-child(3){display:none}.sched td:first-child{width:46px}.sched td{padding:14px 6px}}

.revs{display:grid;gap:0;margin-top:clamp(56px,8vw,110px)}
.rev{display:grid;grid-template-columns:1fr;gap:10px 28px;padding:26px 0;border-top:1px solid var(--navy)}
.rev:last-child{border-bottom:1px solid var(--navy)}
.rev .no{font:700 clamp(56px,8vw,120px)/.8 var(--disp);color:transparent;-webkit-text-stroke:1.5px var(--navy)}
.rev h3{font:700 clamp(26px,3vw,40px)/1 var(--disp);text-transform:uppercase}
.rev p{max-width:60ch;margin-top:8px}
.rev .meta{font:400 12px/1.5 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--navy2)}
@media(min-width:900px){.rev{grid-template-columns:160px 1.1fr 1.4fr 200px;align-items:start}.rev p{margin:0}.rev>.meta{text-align:right}}

.blue{position:relative;background:var(--blue);padding:clamp(72px,10vw,150px) var(--gut);overflow:hidden}
.blue::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(234,243,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(234,243,255,.06) 1px,transparent 1px);background-size:24px 24px}
.cover{display:grid;gap:36px;align-items:center}
@media(min-width:900px){.cover{grid-template-columns:1.1fr .9fr}}
.survey{width:100%;height:auto;aspect-ratio:1;max-width:680px;margin:0 auto}
.survey .ring-d{fill:none;stroke:rgba(234,243,255,.5);stroke-width:1.2;stroke-dasharray:1}
.survey .town{fill:var(--ink)}
.survey text{font:400 11px var(--mono);fill:var(--ink);letter-spacing:.06em}
.survey text.d{fill:var(--dim);font-size:9px}
.survey .cross{stroke:var(--hot);stroke-width:1.4;fill:none}
.towns{columns:2;column-gap:28px;margin-top:20px;font:400 13px/1 var(--mono);letter-spacing:.08em;text-transform:uppercase;list-style:none}
.towns li{padding:10px 0;border-bottom:1px solid var(--faint);break-inside:avoid;display:flex;justify-content:space-between;gap:8px}
.towns li span{color:var(--hot)}

.contact{display:grid;gap:44px}
@media(min-width:900px){.contact{grid-template-columns:.9fr 1.1fr;gap:72px}}
.big-tel{display:block;font:700 clamp(46px,7.4vw,112px)/.9 var(--disp);text-decoration:none;letter-spacing:-.005em;margin:6px 0 18px}
.big-tel:hover{color:var(--hot)}
.cdets{font:400 14px/1.9 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--dim)}
.cdets a{color:var(--ink)}
form.dg{border:1px solid rgba(234,243,255,.55);background:rgba(8,42,102,.7);padding:clamp(18px,3vw,34px);display:grid;gap:18px;position:relative}
form.dg::before{content:"Request for survey · Form DPH-07";display:block;margin-bottom:-4px;font:400 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--hot)}
.fld{display:grid;gap:6px}
.fld label{font:400 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.fld input,.fld select,.fld textarea{font:400 17px/1.3 var(--body);color:var(--ink);background:transparent;border:0;border-bottom:1.5px solid rgba(234,243,255,.6);padding:8px 0;border-radius:0;width:100%}
.fld select option{color:var(--navy)}
.fld textarea{min-height:84px;resize:vertical}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:0;border-color:var(--hot)}
.row2{display:grid;gap:18px}
@media(min-width:600px){.row2{grid-template-columns:1fr 1fr}}
.demo-msg{display:none;font:400 13px/1.5 var(--mono);letter-spacing:.06em;color:var(--navy);background:var(--hot);padding:12px 14px}
.demo-msg.show{display:block}
button.btn{cursor:pointer;background:var(--ink);color:var(--navy);justify-self:start}
button.btn:hover{background:var(--hot)}

footer.ft{background:var(--deeper);padding:36px var(--gut) 44px;font:400 12px/1.7 var(--mono);letter-spacing:.06em;color:var(--dim);text-transform:uppercase}
footer.ft .wrap{display:grid;gap:14px}
footer.ft a{color:var(--ink)}
@media(min-width:900px){footer.ft .wrap{grid-template-columns:1fr auto}}

/* reveal helpers */
.rv{opacity:0;transform:translateY(24px);transition:opacity .8s,transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}

/* reduced motion + no-js: static drawing */
.static .sheet{height:auto}
.static .stage{position:relative;height:auto;overflow:visible;padding:80px 0 20px}
.static .dwg{position:relative;height:auto;aspect-ratio:1600/900;inset:auto}
.static .cards{position:relative;display:grid;gap:14px;padding:0 var(--gut) 40px;pointer-events:auto}
.static .card,.static .card.hero{position:relative;inset:auto;left:auto;top:auto;width:auto;max-width:640px;opacity:1;visibility:visible;transform:none;backdrop-filter:none}
.static .card .spec{display:block}
.static .titleblock,.static .progress,.static .scrollhint,.static .frame,.static .vignette{display:none}
.static .part .dr{animation:none;stroke-dashoffset:0}
.static .pipe,.static .static .note{opacity:1}
.static .note .ln{stroke-dashoffset:0}
.static .rv{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  .run.on .flow,.ring,.pulse,.tapsOn .drip{animation:none}
}

/* inner page */
.ph{padding:140px var(--gut) 60px;position:relative;overflow:hidden}
.ph .wrap{display:grid;gap:36px}
.ph h1{font:700 clamp(54px,11vw,170px)/.84 var(--disp);text-transform:uppercase;letter-spacing:-.01em}
.ph h1 em{font-style:normal;color:var(--hot)}
.ph .lede{font-size:clamp(18px,2vw,22px);max-width:52ch}
.crumbs{font:400 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--dim)}
.crumbs a{color:var(--hot)}
.schem{position:relative;height:340vh}
.schem .stage{height:100svh}
.two{display:grid;gap:36px}
@media(min-width:900px){.two{grid-template-columns:1fr 1fr;gap:64px}}
.steps{list-style:none;counter-reset:s}
.steps li{counter-increment:s;display:grid;grid-template-columns:70px 1fr;gap:6px 14px;padding:22px 0;border-top:1px solid var(--navy)}
.steps li:last-child{border-bottom:1px solid var(--navy)}
.steps li::before{content:"D" counter(s);font:700 44px/1 var(--disp);color:transparent;-webkit-text-stroke:1.5px var(--navy)}
.steps h3{font:700 28px/1 var(--disp);text-transform:uppercase}
.steps p{grid-column:2;color:var(--navy2)}
.faq details{border-top:1px solid var(--navy);padding:18px 0}
.faq details:last-child{border-bottom:1px solid var(--navy)}
.faq summary{cursor:pointer;font:700 26px/1.1 var(--disp);text-transform:uppercase;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--mono)}
.faq details[open] summary::after{content:"−"}
.faq p{margin-top:10px;max-width:60ch;color:var(--navy2)}
.price-box{border:1.5px solid var(--navy);padding:24px;background:rgba(255,255,255,.55)}
.price-box .n{font:700 clamp(64px,9vw,120px)/.85 var(--disp)}
.price-box small{display:block;font:400 12px/1.5 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--navy2);margin-top:10px}
.price-box ul{list-style:none;margin-top:18px;font-size:16px}
.price-box li{padding:9px 0;border-top:1px solid rgba(10,42,102,.25);display:flex;gap:10px}
.price-box li::before{content:"✓";font-family:var(--mono);color:#b8590f}

/* labels scale with the camera so they stay legible */
.dwg{--fp:12.5}
@media(max-width:899px){.dwg{--fp:10.5}}
.lbl{font-family:var(--mono);font-weight:400;font-size:calc(var(--u) * var(--fp) * 1px);fill:var(--ink);letter-spacing:.03em}
.lbl .b{fill:var(--hot)}
.lbl .s{fill:var(--dim)}.lbl.s{fill:var(--dim)}
.sym{fill:none;stroke:var(--hot);stroke-width:calc(var(--u) * 1.6px);stroke-linejoin:round}
.survey .ring-d{stroke-dashoffset:1;transition:stroke-dashoffset 2.4s cubic-bezier(.5,0,.2,1)}
.survey.in .ring-d{stroke-dashoffset:0}
.survey .town,.survey .tl{opacity:0;transition:opacity .6s}
.survey.in .town,.survey.in .tl{opacity:1}
.survey .sweep{transform-origin:300px 300px;animation:sweep 9s linear infinite}
@keyframes sweep{to{transform:rotate(360deg)}}
.static .survey .ring-d{stroke-dashoffset:0}.static .survey .town,.static .survey .tl{opacity:1}
@media(prefers-reduced-motion:reduce){.survey .sweep{animation:none}}

/* inner page diagram */
.sv{position:absolute;left:500px;right:30px;top:70px;bottom:90px}
.dwg2{width:100%;height:100%;--u:1}
.dwg2 .part{stroke-width:2}
.dwg2 .pipe{stroke-width:4}
.dwg2 .flow{stroke-width:4}
.dwg2 .lbl{font-size:12.5px}
.dwg2 .ln{stroke-width:1.2}
@media(max-width:899px){.sv{left:8px;right:8px;top:56px;bottom:auto;height:calc(100% - 330px)}.dwg2 .lbl{font-size:21px}.dwg2 .lbl .s,.dwg2 .lbl.s{display:none}}
.inner .card{top:50%;transform:translateY(calc(-50% + 14px))}
.inner .card.on{transform:translateY(-50%)}
@media(max-width:899px){.inner .card{top:auto;transform:translateY(14px)}.inner .card.on{transform:none}}
.static .schem{height:auto}
.static .sv{position:relative;inset:auto;height:auto;aspect-ratio:900/640;left:auto;right:auto;top:auto;bottom:auto;padding:0 var(--gut)}
.static .inner .card{position:relative;transform:none}

.schem .stage::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(234,243,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(234,243,255,.07) 1px,transparent 1px);background-size:24px 24px}
.schem .stage>*{z-index:1}

@media(max-width:600px){.survey text{font-size:17px}.survey text.d{font-size:13px}}