/* NW-120 v0.3 — implementation of the owner-approved visual.
   Scoped to this page. Shared Keysoft palette, header, navigation and assets are untouched. */
.nw120-review .uf-hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:40px}
.nw120-review .uf-hero h1{font-size:clamp(40px,2.8vw,46px);line-height:1.08;max-width:740px}
.nw120-review .uf-lead p{font-size:14px;line-height:1.8}
.nw120-review .u3-hero-figure{margin:0;min-width:0;align-self:center}
.nw120-review .u3-hero-board{position:relative;aspect-ratio:700/364;width:100%}
.nw120-review .u3-hero-lines{position:absolute;inset:0;width:100%;height:100%;color:#69a65b;stroke:currentColor;stroke-width:1.25;fill:none;overflow:visible}
.nw120-review .u3-hero-lines .u3-dotted{stroke-dasharray:2 4}
.nw120-review .u3-hero-lines circle{fill:#69a65b;stroke:none}
.nw120-review .u3-brand{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;line-height:1.25;flex:none}
.nw120-review .u3-brand>img{width:49px;height:auto;display:block;mix-blend-mode:multiply}
.nw120-review .u3-brand>span{font-size:10px;color:#586c84;font-weight:500}
.nw120-review .u3-brand-large>img{width:110px}
.nw120-review .u3-hero-brand{position:absolute;left:65%;top:1%;display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.nw120-review .u3-hero-brand>span:last-child{font-size:12px;color:#566d82;line-height:1.4}
.nw120-review .u3-icon{stroke:currentColor;fill:none;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;width:34px;height:34px;color:#65a354;flex:none}
.nw120-review .u3-hero-internet{position:absolute;left:28%;top:0;width:17%;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px}
.nw120-review .u3-hero-internet .u3-icon{width:36px;height:36px}
.nw120-review .u3-hero-internet strong{font-weight:600}
.nw120-review .u3-hero-node{position:absolute;display:flex;flex-direction:column;align-items:center;text-align:center;gap:5px;min-width:0}
.nw120-review .u3-hero-node>img{object-fit:contain;width:80%;mix-blend-mode:multiply;max-height:66px;height:auto}
.nw120-review .u3-hero-node strong{font-size:12px;line-height:1.4;font-weight:650;white-space:nowrap}
.nw120-review .u3-hero-node>span{font-size:10px;color:var(--muted);line-height:1.4;white-space:nowrap}
.nw120-review .u3-hero-gateway{left:24%;top:27%;width:25%}
.nw120-review .u3-hero-gateway>img{width:82%;margin-bottom:1px}
.nw120-review .u3-hero-ap{left:1%;top:61%;width:25%}
.nw120-review .u3-hero-ap>img{width:69px;height:65px}
.nw120-review .u3-hero-switch{left:24%;top:61%;width:25%}
.nw120-review .u3-hero-switch>img{width:88%;height:65px}
.nw120-review .u3-hero-camera{left:46%;top:61%;width:24%}
.nw120-review .u3-hero-camera>img{width:78px;height:65px}
.nw120-review .u3-hero-console{position:absolute;left:67%;top:30%;width:33%;display:flex;flex-direction:column;gap:11px;align-items:center;text-align:center}
.nw120-review .u3-hero-console>img{width:100%;height:auto;mix-blend-mode:multiply}
.nw120-review .u3-console-brand{background:#ffffffb8;box-shadow:0 5px 16px #293c4910;padding:8px 11px;border:1px solid #e2e9e9;border-radius:9px}
.nw120-review .u3-hero-console>span:last-child{font-size:10px;line-height:1.4;color:var(--muted)}
.nw120-review .u3-hero-figure figcaption{font-size:10px;line-height:1.55;color:#6a7f72;margin-top:4px;text-align:center}
/* Compact, horizontal example cards with individually readable HTML labels. */
.nw120-review .u3-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:25px}
.nw120-review .u3-section-heading h2{margin-bottom:0}
.nw120-review .u3-section-heading>p{max-width:325px;font-size:12px;margin:0}
.nw120-review .u3-setup-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.nw120-review .u3-setup-card{display:flex;flex-direction:column;min-width:0;border:1px solid #dce6db;border-radius:12px;background:linear-gradient(160deg,#fff,#fbfcfa);padding:22px 19px 19px}
.nw120-review .u3-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.nw120-review .u3-card-top .uf-kicker{font-size:9px;letter-spacing:.07em}
.nw120-review .u3-card-top .uf-kicker::before{display:none}
.nw120-review .u3-setup-card h3{font-size:20px;line-height:1.25;letter-spacing:-.028em;margin:0 0 8px;font-weight:650}
.nw120-review .u3-setup-card .u3-card-intro{font-size:12px;line-height:1.65;margin:0 0 12px}
.nw120-review .u3-setup-card .u3-card-foot{font-size:11px;line-height:1.7;margin:12px 0 0;min-height:38px;color:var(--muted)}
.nw120-review .u3-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:5px;min-height:164px;margin-top:auto;isolation:isolate}
.nw120-review .u3-node{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;min-width:0;position:relative;text-align:center}
.nw120-review .u3-node-label{font-size:10px;line-height:1.3;font-weight:500;color:#415570;overflow-wrap:normal}
.nw120-review .u3-device{width:100%;height:55px;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}
.nw120-review .u3-device>img{max-width:94%;width:auto;height:auto;max-height:47px;object-fit:contain;mix-blend-mode:multiply}
.nw120-review .u3-node[data-node="access-point"] .u3-device>img{height:47px;width:auto}
.nw120-review .u3-node[data-node="camera"] .u3-device>img{height:43px;width:auto}
.nw120-review .u3-node[data-node="internet"] .u3-icon{width:29px;height:29px;background:#fcfdfb}
.nw120-review .u3-flow>.u3-node:not(:last-child)::after,.nw120-review .u3-agg-core>.u3-node:not(:last-child)::after,.nw120-review .u3-access-branch>.u3-node:not(:last-child)::after{content:"";position:absolute;left:85%;width:37%;height:1px;background:#83b66e;top:27px;z-index:0}
.nw120-review .u3-wans{display:flex;flex-direction:column;gap:17px;position:relative;align-items:flex-start;justify-content:center;padding-right:14px;min-width:0}
.nw120-review .u3-wans>div{display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;text-align:center;min-width:0;width:90%}
.nw120-review .u3-wans .u3-icon{width:26px;height:26px}
.nw120-review .u3-wans>div>span{font-size:10px;line-height:1.25;color:#415570}
.nw120-review .u3-wans small{font-size:9px;color:var(--muted)}
.nw120-review .u3-wans i{position:absolute;right:2px;top:14px;height:calc(100% - 43px);width:13px;border:1px dashed #80b16e;border-left:0;border-radius:0 3px 3px 0}
.nw120-review .u3-wans i::after{content:"";position:absolute;right:-13px;top:50%;width:13px;height:1px;background:#83b66e}
/* Aggregation uplinks end at access switches. Endpoints never connect directly to the aggregation tier. */
.nw120-review .u3-aggregation{display:grid;grid-template-columns:minmax(0,3fr) 21px minmax(0,2fr);gap:1px;align-items:center;min-height:164px;margin-top:auto;isolation:isolate}
.nw120-review .u3-agg-core{display:grid;grid-template-columns:.65fr 1fr 1.1fr;gap:4px;align-items:center;min-width:0}
.nw120-review .u3-aggregation .u3-node-label{font-size:10px}
.nw120-review .u3-aggregation .u3-node{gap:4px;min-height:67px;justify-content:flex-start}
.nw120-review .u3-aggregation .u3-device{height:39px}
.nw120-review .u3-aggregation .u3-device>img{max-height:34px}
.nw120-review .u3-aggregation .u3-node[data-node="internet"] .u3-icon{width:24px;height:24px}
.nw120-review .u3-aggregation .u3-agg-core>.u3-node::after,.nw120-review .u3-aggregation .u3-access-branch>.u3-node::after{top:20px}
.nw120-review .u3-access-layer{display:flex;flex-direction:column;gap:14px;min-width:0}
.nw120-review .u3-access-branch{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:7px;min-width:0;position:relative}
.nw120-review .u3-agg-mobile-link{display:none}
.nw120-review .u3-uplinks{height:104px;position:relative;margin-top:-25px}
.nw120-review .u3-uplinks>span{position:absolute;font-size:8px;line-height:1;color:#628653;left:-6px;top:-6px;white-space:nowrap}
.nw120-review .u3-uplinks i{position:absolute;left:8px;right:0;top:12px;bottom:11px;border:1px solid #83b66e;border-right:0;border-radius:3px 0 0 3px}
.nw120-review .u3-uplinks i::before{content:"";position:absolute;left:-9px;top:50%;width:8px;height:1px;background:#83b66e}
.nw120-review .uf-section .u3-setup-note{max-width:none;margin-top:22px}
.nw120-review .u3-family{margin-bottom:18px}
/* Retain the owner-requested Store panel, with the Keysoft colour scheme. */
.nw120-review .uf-store-panel{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:26px;padding:32px 35px;border:1px solid #dbe4d4;border-radius:15px;background:#f6f9f1}
.nw120-review .uf-store-panel>.uf-icon-tile{width:57px;height:57px;background:#eef5e5}
.nw120-review .uf-store-copy h2{font-size:27px;line-height:1.18;margin:9px 0 12px}
.nw120-review .uf-store-copy>p{font-size:13px;line-height:1.8;margin:0;max-width:815px}
.nw120-review main a.uf-store-action{display:inline-flex;align-items:center;justify-content:center;gap:15px;text-decoration:none;color:#254729;background:#fff;border:1px solid #b9cdaa;box-shadow:none;font-size:12px;line-height:1.5;font-weight:650;min-height:46px;padding:12px 19px;white-space:normal;text-align:center}
.nw120-review main a.uf-store-action:hover{color:#173d1a;background:#edf5e3;border-color:#8cb770}
.nw120-review main a.uf-store-action:focus-visible{outline:3px solid #71a85a;outline-offset:4px}
@media(max-width:1279px){
 .nw120-review .uf-hero-grid{gap:24px}
 .nw120-review .uf-hero h1{font-size:44px}
 .nw120-review .u3-hero-node strong{font-size:10px}.nw120-review .u3-hero-node>span{font-size:9px}
 .nw120-review .u3-hero-node>img{max-height:48px}.nw120-review .u3-hero-ap>img,.nw120-review .u3-hero-camera>img{width:54px;height:48px}
 .nw120-review .u3-hero-switch>img{height:48px}
 .nw120-review .u3-setup-card{padding:18px 15px}.nw120-review .u3-setup-card h3{font-size:18px}
 .nw120-review .u3-brand>img{width:43px}.nw120-review .u3-brand-large>img{width:90px}
 .nw120-review .uf-store-panel{grid-template-columns:auto minmax(0,1fr);padding:28px}
 .nw120-review main a.uf-store-action{grid-column:2;justify-self:start}
}
@media(max-width:1100px){
 .nw120-review .uf-hero-grid{grid-template-columns:1fr;gap:36px}
 .nw120-review .uf-hero h1{max-width:850px}
 .nw120-review .u3-hero-figure{width:100%;max-width:700px;justify-self:center}
 .nw120-review .u3-hero-node strong{font-size:12px}.nw120-review .u3-hero-node>span{font-size:10px}
 .nw120-review .u3-hero-node>img{max-height:65px}.nw120-review .u3-hero-ap>img,.nw120-review .u3-hero-camera>img{width:70px;height:65px}.nw120-review .u3-hero-switch>img{height:65px}
 .nw120-review .u3-setup-grid{grid-template-columns:1fr}
 .nw120-review .u3-setup-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 30px;padding:26px}
 .nw120-review .u3-card-top{grid-column:1;flex-wrap:wrap}
 .nw120-review .u3-setup-card h3,.nw120-review .u3-card-intro,.nw120-review .u3-card-foot{grid-column:1}
 .nw120-review .u3-setup-card h3{font-size:24px}
 .nw120-review .u3-flow,.nw120-review .u3-aggregation{grid-column:2;grid-row:1 / span 4;margin:0}
 .nw120-review .u3-section-heading{display:block}
 .nw120-review .u3-section-heading>p{max-width:none;margin-top:15px}
 .nw120-review .u3-brand>img{width:49px}.nw120-review .u3-brand-large>img{width:105px}
}
@media(max-width:760px){
 .nw120-review .uf-hero h1{font-size:37px}.nw120-review .uf-hero-grid{gap:32px}
 .nw120-review .u3-setup-card{display:flex;padding:23px;gap:0}
 .nw120-review .u3-setup-card h3{font-size:23px}
 .nw120-review .u3-flow,.nw120-review .u3-aggregation{margin-top:10px;min-height:170px}
 .nw120-review .u3-node-label{font-size:10px}.nw120-review .u3-device{height:50px}
 .nw120-review .u3-aggregation{display:flex;flex-direction:column;gap:0;align-items:stretch;min-height:290px}
 .nw120-review .u3-agg-core{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}
 .nw120-review .u3-aggregation .u3-node-label{font-size:11px}
 .nw120-review .u3-aggregation .u3-device{height:47px}.nw120-review .u3-aggregation .u3-device>img{max-height:40px}
 .nw120-review .u3-aggregation .u3-agg-core>.u3-node::after{top:24px}
 .nw120-review .u3-uplinks{height:44px;margin:0;transform:none}
 .nw120-review .u3-uplinks>span{left:60%;top:1px;transform:none;font-size:10px}
 .nw120-review .u3-uplinks i{display:none}
 .nw120-review .u3-agg-mobile-link{display:block;width:100%;height:44px;fill:none;stroke:#83b66e;stroke-width:1.2;overflow:visible}
 .nw120-review .u3-agg-mobile-link path{vector-effect:non-scaling-stroke}
 .nw120-review .u3-access-layer{flex-direction:row;gap:22px;justify-content:center}
 .nw120-review .u3-access-branch{display:flex;flex-direction:column;gap:12px;width:46%}
 .nw120-review .u3-access-branch .u3-node{min-height:66px}
 .nw120-review .u3-aggregation .u3-access-branch>.u3-node:not(:last-child)::after{left:50%;top:100%;width:1px;height:12px}
 .nw120-review .uf-store-panel{grid-template-columns:1fr;gap:18px;padding:25px}
 .nw120-review .uf-store-panel>.uf-icon-tile{width:48px;height:48px}
 .nw120-review .uf-store-copy h2{font-size:26px}
 .nw120-review main a.uf-store-action{grid-column:auto;justify-self:stretch}
}
@media(max-width:600px){
 .nw120-review .u3-hero-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 6px;aspect-ratio:auto;padding:23px 12px;border:1px solid #dce7df;border-radius:15px;background:#ffffff60}
 .nw120-review .u3-hero-board>*{position:static;width:auto;min-width:0}
 .nw120-review .u3-hero-board .u3-hero-lines{display:none}
 .nw120-review .u3-hero-brand{grid-column:1 / -1;align-items:center;text-align:center;gap:6px}
 .nw120-review .u3-hero-brand br{display:none}
 .nw120-review .u3-hero-internet{grid-column:1;align-self:center;justify-self:center;font-size:11px}
 .nw120-review .u3-hero-gateway{grid-column:2 / 4;border-left:1px solid #96bc80;padding-left:12px}
 .nw120-review .u3-hero-gateway>img{width:123px;height:auto}
 .nw120-review .u3-hero-ap,.nw120-review .u3-hero-switch,.nw120-review .u3-hero-camera{grid-row:3;border-top:1px solid #b7cdab;padding-top:16px;gap:5px}
 .nw120-review .u3-hero-ap>img,.nw120-review .u3-hero-camera>img{width:55px;height:50px}
 .nw120-review .u3-hero-switch>img{height:50px;width:94%}
 .nw120-review .u3-hero-node strong{white-space:normal;font-size:11px;line-height:1.35}
 .nw120-review .u3-hero-node>span{white-space:normal;font-size:10px;line-height:1.5}
 .nw120-review .u3-hero-console{grid-column:1 / -1;width:100%;max-width:275px;justify-self:center;gap:10px;border-top:1px solid #dce7df;padding-top:18px}
 .nw120-review .u3-hero-console>img{width:230px;max-width:100%;height:auto}
 .nw120-review .u3-hero-console>span:last-child{font-size:11px}
 .nw120-review .u3-hero-figure figcaption{margin-top:12px}
}
@media(max-width:360px){
 .nw120-review .uf-hero h1{font-size:32px}.nw120-review .u3-setup-card{padding:19px 15px}
 .nw120-review .u3-setup-card h3{font-size:21px}.nw120-review .u3-node-label{font-size:9px}
 .nw120-review .u3-hero-board{padding:20px 10px}.nw120-review .u3-hero-node strong{font-size:10px}
}
