.detail-page .site-nav [aria-current=page]{color:var(--garnet);font-weight:700}
.detail-hero{padding:calc(var(--head) + 26px) 0 58px;border-bottom:1px solid var(--rule)}
.breadcrumbs{display:flex;gap:10px;align-items:center;font-size:11px;color:#7a8176;margin:0 0 30px}
.breadcrumbs a{text-decoration:none}.breadcrumbs a:hover{color:var(--garnet)}
.detail-hero-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:7%;align-items:center}
.detail-hero h1{font-size:clamp(40px,4.6vw,65px);line-height:1.09;max-width:12ch;margin:0 0 24px;letter-spacing:-.055em}
.detail-hero .lead{font-size:16px;color:#626c61;max-width:43ch;line-height:1.75}
.detail-hero .actions{margin-top:27px;gap:22px}
.detail-hero .text-link{font-size:13px}
.detail-hero-image{margin:0;border-radius:21px;overflow:hidden;background:#202321}
.detail-hero-image img{display:block;width:100%;height:auto;aspect-ratio:1.32;object-fit:cover;object-position:45% 50%}
.detail-hero-image.product-image img{object-position:88% 50%;aspect-ratio:1.1}
.visual-panel{border:1px solid #daddd3;border-radius:20px;background:linear-gradient(140deg,#fff,#efeee8);padding:24px;overflow:hidden}
.visual-panel svg{display:block;width:100%;height:auto}
.visual-panel text{font:13px var(--font);fill:#52604f}.visual-panel .diagram-note{font-size:11px;fill:#798570}
.hero-graphic{padding:15px;aspect-ratio:1.3;display:grid;align-items:center}
.detail-section{padding:68px 0;border-bottom:1px solid #e2e2da}
.detail-row{display:grid;grid-template-columns:.85fr 1.15fr;gap:9%;align-items:start}
.detail-row .h2{max-width:13ch;font-size:clamp(32px,3.8vw,50px)}
.reading-copy{color:#5f6a5c;font-size:16px;line-height:1.85}
.reading-copy>p+p{margin-top:20px}
.reading-copy .text-link{margin-top:24px}
.visual-section{padding:12px 0 30px}
.wide-diagram{padding:35px;max-width:920px;margin:auto}
.wide-diagram svg{max-height:470px}
.figure-caption{font-size:12px;color:#75806e;max-width:920px;margin:15px auto 0}
.spec-list{margin:0}
.spec-list>div{display:grid;grid-template-columns:165px 1fr;gap:22px;padding:18px 0;border-top:1px solid var(--rule)}
.spec-list dt{font-size:13px;line-height:1.6;font-weight:700;color:#30392e}.spec-list dd{margin:0;font-size:14px;line-height:1.8;color:#65715f}
.faqs details{border-top:1px solid var(--rule)}
.faqs details:last-child{border-bottom:1px solid var(--rule)}
.faqs summary{display:flex;justify-content:space-between;gap:25px;align-items:center;min-height:65px;list-style:none;font-size:14px;line-height:1.6;font-weight:700;padding:14px 0;cursor:pointer}
.faqs summary::-webkit-details-marker{display:none}
.faqs summary span{font-size:22px;line-height:1;font-weight:400;color:#7a8673;transition:transform .2s}
.faqs details[open] summary span{transform:rotate(45deg)}
.faqs details p{margin:0 24px 22px 0;color:#65715f;font-size:14px;line-height:1.8}
.sensor-tabs{display:flex;gap:7px;flex-wrap:wrap;margin:28px 0 22px}
.sensor-tabs button{min-height:44px;padding:0 16px;border:1px solid #d1d6ca;border-radius:8px;background:none;font:inherit;font-size:13px;cursor:pointer}
.sensor-tabs button[aria-selected=true]{background:var(--garnet);border-color:var(--garnet);color:#fff}
#signal-panel h3{font-size:17px;letter-spacing:-.02em;line-height:1.4;margin-bottom:12px}
#signal-panel p{font-size:14px;color:#687460;line-height:1.8;max-width:40ch}
.signal-graphic [data-sensor-highlight]{transition:opacity .3s}.signal-graphic [data-sensor-highlight] circle{transition:fill .3s,stroke-width .3s}
.signal-graphic[data-channel=flow] [data-sensor-highlight=flow] circle,.signal-graphic[data-channel=temperature] [data-sensor-highlight=temperature] circle,.signal-graphic[data-channel=pressure] [data-sensor-highlight=pressure] circle{fill:#e7c9d2;stroke-width:3}
.clean-list{list-style:none;padding:0;margin:0;display:grid;gap:0}
.clean-list li{border-top:1px solid var(--rule);padding:16px 0;font-size:14px;line-height:1.8}
.detail-valve-control{border:1px solid #daddd3;border-radius:13px;background:#fff8;padding:17px 20px;margin-top:14px}
.detail-valve-control label{font-size:13px;font-weight:700}.detail-valve-control input{display:block;width:100%;margin:5px 0}
.detail-valve-control output{margin-top:10px}
#detail-ball,#detail-needle{transition:transform .4s var(--ease)}
.response-chain{display:flex;flex-wrap:wrap;align-items:center;gap:13px;font-size:12px;font-weight:700;color:var(--garnet);border:1px solid var(--rule);border-radius:10px;padding:17px;margin-bottom:24px}
.response-chain svg{width:19px;height:19px;flex:none}
.soft-section{background:#ecefe6}
.integration-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.integration-grid article{border-top:1px solid #bfc8b6;padding:20px 3px 6px}
.integration-grid h3{font-size:16px;margin:16px 0 12px}.integration-grid p{font-size:13px;color:#697660;line-height:1.8}
.interface-dot{display:block;width:8px;height:8px;border:1px solid var(--garnet);border-radius:50%}
.explore-section{padding:62px 0 72px;border-top:1px solid var(--rule)}
.section-top{display:flex;align-items:flex-end;justify-content:space-between;gap:35px;margin-bottom:28px}
.section-top .h2{font-size:clamp(30px,3.6vw,48px)}.section-top .eyebrow{margin-bottom:13px}
.explore-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.explore-card{position:relative;display:block;min-height:232px;border:1px solid #d5d9cc;border-radius:13px;padding:25px 25px 55px;background:#ffffff69;text-decoration:none;transition:background .25s,border-color .25s,transform .25s}
.explore-card:hover{transform:translateY(-4px);background:#fff;border-color:#b4bea8}
.explore-card h3{font-size:19px;line-height:1.35;letter-spacing:-.035em;margin:16px 0 12px;font-weight:400;color:#283825}
.explore-card p{font-size:13px;line-height:1.8;color:#68765f;max-width:36ch}
.card-tag{font-size:10px;color:var(--garnet);letter-spacing:.07em;text-transform:uppercase;font-weight:700}
.card-arrow{position:absolute;bottom:21px;right:23px;color:#7e8d72}.card-arrow svg{width:20px;height:20px}
.footer-pages{max-width:var(--max);margin:22px auto 0;padding:20px var(--gutter) 0;border-top:1px solid var(--rule);display:flex;gap:25px;flex-wrap:wrap;justify-content:center;font-size:11px;color:#75816b}
.footer-pages a{text-decoration:none;display:inline-flex;min-height:28px;align-items:center}.footer-pages a:hover{color:var(--garnet)}
.guide-feature{display:grid;grid-template-columns:1fr 1fr;gap:7%;align-items:center;padding-bottom:48px}
.guide-feature .h2{max-width:13ch;font-size:43px}.guide-feature p:not(.eyebrow){font-size:15px;color:#63705b;max-width:39ch;margin:20px 0 25px;line-height:1.8}
.guide-article{padding:60px 0 80px}.guide-layout{display:grid;grid-template-columns:240px minmax(0,730px);gap:8%;justify-content:center}
.guide-toc{position:sticky;top:105px;display:grid;gap:6px;align-self:start;font-size:12px;padding-right:25px}
.guide-toc strong{font-size:11px;letter-spacing:.04em;margin-bottom:12px}.guide-toc>a{padding:8px 0;text-decoration:none;color:#738067}.guide-toc>a:hover{color:var(--garnet)}.guide-toc .text-link{font-size:11px;gap:8px;margin-top:18px;line-height:1.5;text-align:left}
.guide-copy{font-size:16px;line-height:1.9;color:#5f6b57}
.guide-copy section+section{margin-top:45px;padding-top:30px;border-top:1px solid var(--rule)}
.guide-copy h2{font-size:27px;color:#263322;letter-spacing:-.035em;margin-bottom:20px;line-height:1.25}
.guide-copy p+p{margin-top:17px}.guide-copy ul{padding-left:21px;margin:22px 0}.guide-copy li{margin:9px 0}
.guide-callout{background:#e9ede2;border-radius:10px;padding:20px 24px;margin-top:25px;font-size:13px}.guide-callout strong{font-size:12px;display:block;margin-bottom:8px;color:var(--garnet)}
.guide-references>a{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0;border-bottom:1px solid var(--rule);font-size:12px;line-height:1.6;color:#6c7d5e;text-decoration:none}.guide-references svg{width:18px;height:18px;flex:none}
.flow-supply,.flow-return{stroke-dasharray:7 4;animation:fluid-path 3s linear infinite}.flow-return{animation-duration:3.6s}
@keyframes fluid-path{to{stroke-dashoffset:-44}}
@media(max-width:999px){.detail-hero-grid{gap:5%}.detail-hero h1{font-size:45px}.detail-row{gap:6%}.detail-row .h2{font-size:37px}.spec-list>div{grid-template-columns:1fr;gap:7px}.integration-grid{grid-template-columns:1fr 1fr}.explore-card{padding:20px 19px 50px}.guide-layout{grid-template-columns:180px minmax(0,1fr);gap:5%}.guide-toc{padding-right:0}.guide-feature .h2{font-size:36px}}
@media(max-width:699px){
 .detail-hero{padding:87px 0 31px}.breadcrumbs{font-size:10px;margin-bottom:25px;gap:8px}.detail-hero-grid{grid-template-columns:1fr;gap:27px}.detail-hero h1{font-size:clamp(36px,9vw,46px);max-width:15ch;line-height:1.08;margin-bottom:20px}.detail-hero .lead{font-size:14px;line-height:1.75;max-width:none}.detail-hero .actions{margin-top:22px;gap:18px}.detail-hero .btn{font-size:12px;padding:0 17px;min-height:44px}.detail-hero .text-link{font-size:12px}
 .detail-hero-image{border-radius:14px}.detail-hero-image img,.detail-hero-image.product-image img{aspect-ratio:1.5;max-height:260px}.visual-panel{padding:12px;border-radius:14px}.hero-graphic{aspect-ratio:1.4;max-height:265px}.hero-graphic svg{max-height:245px}.visual-panel text{font-size:22px}.visual-panel .diagram-note{font-size:16px}
 .detail-section{padding:38px 0}.detail-row{grid-template-columns:1fr;gap:22px}.detail-row .h2{font-size:33px;max-width:16ch}.reading-copy{font-size:14px;line-height:1.8}.reading-copy>p+p{margin-top:17px}.reading-copy .text-link{font-size:12px}
 .visual-section{padding:0 0 20px}.wide-diagram{padding:15px}.figure-caption{font-size:11px;line-height:1.65;margin-top:11px}.spec-list>div{padding:15px 0}.spec-list dt{font-size:12px}.spec-list dd{font-size:13px;line-height:1.75}
 .faqs summary{font-size:13px;min-height:57px;padding:13px 0;gap:20px}.faqs summary span{font-size:20px}.faqs details p{font-size:13px;line-height:1.75;margin-right:15px}
 .sensor-tabs{gap:6px;margin:21px 0}.sensor-tabs button{font-size:12px;padding:0 12px;min-height:44px}#signal-panel h3{font-size:16px}#signal-panel p{font-size:13px;line-height:1.75;max-width:none}.clean-list li{font-size:13px;padding:13px 0}
 .detail-valve-control{padding:13px 16px}.detail-valve-control label{font-size:12px}.response-chain{gap:8px;padding:13px;font-size:10px}.response-chain svg{width:16px}.integration-grid{gap:18px 20px}.integration-grid h3{font-size:15px;margin:12px 0 10px}.integration-grid p{font-size:12px;line-height:1.7}
 .explore-section{padding:37px 0 42px}.section-top{display:block;margin-bottom:22px}.section-top .h2{font-size:31px}.section-top .text-link{font-size:12px;margin-top:17px}.explore-grid{grid-template-columns:1fr;gap:12px}.explore-card{min-height:0;padding:20px 42px 20px 21px}.explore-card h3{font-size:19px;margin:11px 0 9px}.explore-card p{font-size:13px;max-width:none}.card-tag{font-size:9px}.card-arrow{right:15px;bottom:20px}.card-arrow svg{width:17px}
 .footer-pages{gap:8px 20px;justify-content:flex-start;padding-top:15px;margin-top:15px;font-size:11px}.footer-pages a{min-height:36px}
 .guide-feature{grid-template-columns:1fr;gap:25px;padding-bottom:30px}.guide-feature .h2{font-size:32px;max-width:15ch}.guide-feature p:not(.eyebrow){font-size:14px;margin:16px 0 22px;max-width:none}.guide-feature .btn{font-size:12px}.guide-feature .visual-panel svg{max-height:255px}
 .guide-article{padding:30px 0 45px}.guide-layout{grid-template-columns:1fr;gap:32px}.guide-toc{position:static;display:flex;flex-wrap:wrap;gap:6px 17px;padding-bottom:22px;border-bottom:1px solid var(--rule);font-size:11px}.guide-toc strong{width:100%;margin:0 0 7px}.guide-toc>a{padding:5px 0}.guide-toc .text-link{width:100%;margin-top:5px;font-size:11px}
 .guide-copy{font-size:14px;line-height:1.85}.guide-copy h2{font-size:25px;margin-bottom:17px}.guide-copy section+section{margin-top:28px;padding-top:25px}.guide-callout{padding:17px 20px;font-size:12px}.guide-references>a{font-size:11px}
}
@media(prefers-reduced-motion:reduce){.flow-supply,.flow-return{animation:none}#detail-ball,#detail-needle{transition:none}}
